@correlucas
Posted
Aman, congratulations for your solution!
Can you explain your question?
I saw that you've used gap inside the grid and your .container is already centered. I can see your solution working properly only the card is a little bit different from the design card but is only a matter of fixing the card padding.
What you want to change? Which padding you refer?
Marked as helpful
@Amandagne
Posted
@correlucas I used the same padding for all the edges of the container. but still the bottom one seems much bigger one the other ones. and I also used the same flex gap for all the divs inside the .container. but the space between the last paragraph in the .container and the container itself is bigger compared to the others.
@correlucas
Posted
@Amandagne Note in the comparison view that the gap-column is a little bit smaller than the gap-row theyre not the same value. The values are these: row-gap: 24px; column-gap: 30px;`
You can check if there's not a line-height in some heading or paragraph that's creating an additive padding. If you set a line-height bigger than the font-size itself or a value bigger font-size: 1; this creates a little space between lines.
You check if this line-height that's causing this strange behavior. If you set --- * { line-height: 1;} --- for all elements you can see if the problem comes from line-height, but then you've to remove this value to don't broken the elements excluding the default line-height.
Then tell me if you found what was causing this space between the p, ok?
Happy coding.
Marked as helpful
@Amandagne
Posted
@correlucas Okay. I'll check it and fix if it's there. Thank you by the way you are very helpful.
