W3C home > Mailing lists > Public > www-style@w3.org > July 2015

[css-flexbox] minimum spacing?

From: Den <cyraid@gmail.com>
Date: Sun, 05 Jul 2015 16:13:28 +0000
Message-ID: <559916B2.4070002@gmail.com>
To: www-style@w3.org
Hi there,

     There seems to be issues with creating a static spacing of children 
in the flex container.  There are questions on the net already which ask 
this, and the only 'solution' would be to enforce a constant margin to 
all children, and a negative margin of the same value to negate.  Let's 
say you want to create a layout of children all 4px spaced, you could 
accomplish this with margin, but you will have unnecessary spacing when 
there is no wrapping.


     Let's say you have a 'row' layout of 4 same size boxes, and it 
covers about half of the screen and you are spacing them out with '4px' 
margin-right.  Now let's say you resize the browser and it wraps, 2 are 
on the top, and 2 are on the bottom; now the 2 children that are wrapped 
are hugging the top row.  You would say you could do 'margin-bottom' on 
the items, but then if they aren't wrapped, the content under it will 
have unwanted spacing.


     Add a new property could be added called *flex-spacing-x*, and 
*flex-spacing-y* (using length as values obviously). These properties 
could share the same priority when calculating as 'margin'? Respecting 
min-width, etc.

I'm currently facing this problem as we speak, and the only known 
work-around is the margin negation.
Any thoughts?

- Dennis Fehr
Received on Friday, 10 July 2015 08:49:09 UTC

This archive was generated by hypermail 2.4.0 : Friday, 17 January 2020 22:52:18 UTC