Bug 4: Why flex basis of 0% instead of auto?
See original GitHub issueWhen not explicitly set, flex-basis
is auto
, according to MDN. So you’d expect
flex: 1;
to be rewritten to
flex: 1 1 auto;
But the plugin uses 0%
instead of auto
, which yields different results. At least in IE10, a flex-basis
of 0%
will prevent the element from growing.
Issue Analytics
- State:
- Created 7 years ago
- Comments:8 (3 by maintainers)
Top Results From Across the Web
CSS flex-basis: 0% has different behaviour to flex-basis: 0px
The issue is related to the usage of percentage. Using 0 or 0px is trivial since you will set the initial height to...
Read more >Why No flex-basis or "0" flex-basis still break the line when ...
The initial value for flex-basis is actually auto , not 0 , so if you don't set the flex-basis and only use flex-grow...
Read more >flex-basis - CSS: Cascading Style Sheets - MDN Web Docs
Then, flex-basis:auto was changed to mean automatic sizing, and "main-size" was introduced as the "look at my width or height property" keyword.
Read more >Firefox 36 flex-basis 0% in sized container #25 - GitHub
In Firefox, the height of wrapper overflow: auto; element grows to the height of its content when the basis uses 0% instead of...
Read more >The thing people get wrong about flex-basis - YouTube
Dive even deeper with my 4 -hour long flexbox course: https://flexboxsimplified.comFlex- basis is one of those things that people sort of, ...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Ah yes, you are right. Upon closer inspection, it indeed said so in the page I linked:
Nevermind, I just realized that is is a manifestation of Bug #7 😦