html - CSS3 Flex: flex-grow + justify-content? -
good day,
i have 1 question
can use @ once flex , justify-content ?
i want "flex-item(s)" have full size container , simultaneously space between it
<ul class="flex-container space-between"> <li class="flex-item">1</li> <li class="flex-item">2</li> <li class="flex-item">3</li> <li class="flex-item">4</li> <li class="flex-item">5</li> </ul>
just use margin childs:
.flex-item { margin: 0 10px; }
to remove space left , right of container use first- , last-child selectors:
.flex-item:first-child{ margin-left: 0; } .flex-item:last-child{ margin-right: 0; }
see http://jsfiddle.net/7yttrtm4/2/
or add negative margin container:
.flex-container { margin: 0 -10px; }
Comments
Post a Comment