Same width card and container

Hi, how I can make the same width between a container and other container with cards like the example of the image.

in other words the same alignment.


Without seeing your code it is difficult to say, but I would think that the first card is in a different row to the others and has different padding/margin/gutters.

As @richards wrote, it’s hard to tell what’s going on here without seeing your BSS file or code. It appears that the body of your page is a light gray, while the upper container has a white background, and the all contents within it have transparent backgrounds, so you are not seeing any of the padding or margins on the rows/columns, whereas on the component below that contains your cards has a transparent background, while the cards have white and black backgrounds.

This is expected behavior.

If you add a background to the bottom container, you should see something like this…

You could try removing the padding from the columns that have the cards in them by adding the utility class ps-0 to the left column and pe-0 to the right column via the Attributes panel. This should make the bottom look like the top. Of course, if your columns are stacking (as opposed to being next to each other at a certain breakpoint (for example, SM and below, then you’d have to change the classes to ps-md-0 and pe-md-0.

Again, it’s hard to tell without seeing your project. Can you post a link to your live website?