Bug 120003 - Spec change: margins/paddings inside a flex container are relative to their respective dimension, not always the inline dimension (as in block layout)
Summary: Spec change: margins/paddings inside a flex container are relative to their r...
Status: RESOLVED DUPLICATE of bug 113519
Alias: None
Product: WebKit
Classification: Unclassified
Component: CSS (show other bugs)
Version: 528+ (Nightly build)
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
URL: http://jsfiddle.net/m_gol/uVVFn/7/
Keywords:
Depends on:
Blocks:
 
Reported: 2013-08-19 01:56 PDT by Michał Gołębiowski-Owczarek
Modified: 2013-08-22 16:03 PDT (History)
2 users (show)

See Also:


Attachments

Note You need to log in before you can comment on or make changes to this bug.
Description Michał Gołębiowski-Owczarek 2013-08-19 01:56:47 PDT
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
Comment 1 Michał Gołębiowski-Owczarek 2013-08-19 02:03:11 PDT
Related spec fragment: http://dev.w3.org/csswg/css-flexbox/#item-margins
Comment 2 Michał Gołębiowski-Owczarek 2013-08-19 02:10:25 PDT
Related Internet Explorer ticket: https://connect.microsoft.com/IE/feedback/details/797724
Comment 3 Christian Biesinger 2013-08-22 16:03:16 PDT

*** This bug has been marked as a duplicate of bug 113519 ***