Answer by Michael_B for Removing margin from flex items when they wrap
As mentioned in another answer, the common way to solve this problem, which is used by many frameworks, is to apply negative margin and padding combinations. Even flexbox provides no clean solution....
View ArticleAnswer by LGSon for Removing margin from flex items when they wrap
The most common way, which most framework use to solve that, is to set a top margin on the items (tag) instead, and then compensate that with a negative margin on the items parent (tags) * { margin: 0;...
View ArticleAnswer by Hiren Vaghasiya for Removing margin from flex items when they wrap
use this li.tag:nth-last-child(-n+4) { margin-bottom: 0; } * { margin: 0; padding: 0; } html, body { box-sizing: border-box; } .container { width: 600px; margin: 0 auto; margin-top: 25px; border: 1px...
View ArticleAnswer by Saurav Rastogi for Removing margin from flex items when they wrap
Adjust the padding-bottom for .tags instead. Because you'll never know how many tags will appear on the bottom part of the list (this solution is much flexible), Like: .tags { padding: 5px 0 0; } Have...
View ArticleRemoving margin from flex items when they wrap
Following is my code which is working fine, except the last line in a container which is adding margin-bottom: 5px; from .tag css class. Problem I am facing is the tag list is dynamic so I cannot...
View ArticleAnswer by yankeedoodle for Removing margin from flex items when they wrap
I know this has been years, but I think the best way to do it is to use the line-height CSS property.https://developer.mozilla.org/en-US/docs/Web/CSS/line-height
View ArticleAnswer by Gustavo Fonseca for Removing margin from flex items when they wrap
Now you can use the gap property! The row gap will not be applied at the bottom of the last line.gap: 5px;
View Article