Quantcast
Channel: Active questions tagged flexbox - Stack Overflow
Viewing all articles
Browse latest Browse all 1320

How to align elements to the left and right using flex-wrap [duplicate]

$
0
0

I have this aqua container with 6 divs inside of it. I'm using flex-wrap to wrap the divs when they get too big for the current screen, however I want the first div on the top line to align to the left of the aqua container and the final div on that line to align to the right so even when a div gets pushed to a second line, the full space of the container is taken up and there is no empty space leftover.

I don't want to use space-between because I want the gap between each div to stay the same (32px).

What I have:Example

code:

.container {  width: 90vw;  margin: auto;  background-color: aqua;  display: flex;  flex-wrap: wrap;  gap: 32px;}.container div {  background-color: blue;  height: 200px;  width: 300px;}
<div class="container"><div></div><div></div><div></div><div></div><div></div><div></div></div>

Viewing all articles
Browse latest Browse all 1320

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>