Thank you Philippe. Responses below:
On 5/1/15 4:55 PM, Philippe Wittenbergh wrote:
Le 2 mai 2015 à 06:50, David Hucklesby <[email protected]> a écrit :
This is the bare bones of a grid of thumbnails. Works okay in Opera and
Chrome, but the top and bottom padding disappear in Firefox:
<http://codepen.io/hucklesby/pen/MwwXWP>
FWIW this does not happen in a float or inline-block layout.
The answer is here: https://drafts.csswg.org/css-flexbox/#item-margins
[quote] Percentage margins and paddings on flex items are always resolved
against their respective dimensions; unlike blocks, they do not always
resolve against the inline dimension of their containing block. [/quote]
Ah, yes. Did not know about that. Confused by the fact Chrome *does* apply the
padding.
PS - don’t forget to add the -webkit- prefixed properties / values for
Safari.
Actually am applying this on top of inline-blocks via @supports ( flex-wrap:
wrap ) to prevent old Android versions using it. So Safari is locked out anyway.
BTW inline-blocks work perfectly if you minimize the HTML - no gaps. :)
Thank you, too, for the many insights you have given me with your generous
contributions to this list. Much appreciated.
--
Cordially,
David
______________________________________________________________________
css-discuss [[email protected]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
