Bug 120003
| Summary: | Spec change: margins/paddings inside a flex container are relative to their respective dimension, not always the inline dimension (as in block layout) | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Michał Gołębiowski-Owczarek <m.goleb+bugzilla> |
| Component: | CSS | Assignee: | Nobody <webkit-unassigned> |
| Status: | RESOLVED DUPLICATE | ||
| Severity: | Normal | CC: | cbiesinger, simon.fraser |
| Priority: | P2 | ||
| Version: | 528+ (Nightly build) | ||
| Hardware: | Unspecified | ||
| OS: | Unspecified | ||
| URL: | http://jsfiddle.net/m_gol/uVVFn/7/ | ||
Michał Gołębiowski-Owczarek
According to the spec change from March 2013:
http://lists.w3.org/Archives/Public/www-style/2013Mar/0688.html
margins/paddings inside a flex container should be relative to their respective dimensions, e.g. padding-top: 50% sets padding to 50% of height, not width as it is in block layout.
So far only Firefox has implemented the change which makes it impossible to use percentages for paddings in flex containers on the web. :(
Related Chromium ticket: https://code.google.com/p/chromium/issues/detail?id=275327
| Attachments | ||
|---|---|---|
| Add attachment proposed patch, testcase, etc. |
Michał Gołębiowski-Owczarek
Related spec fragment: http://dev.w3.org/csswg/css-flexbox/#item-margins
Michał Gołębiowski-Owczarek
Related Internet Explorer ticket: https://connect.microsoft.com/IE/feedback/details/797724
Christian Biesinger
*** This bug has been marked as a duplicate of bug 113519 ***