tags: tips, chrome
Chrome 72 introduced a change in how flexbox elements with height: 100%
renders, that caused some strange product breakage from one day to another without any code change.
The fix was simple but hard to find.
flexbox elements with height: 100%
now need to have min-height
set, even 0 value is ok.
.list {
display: flex;
}
.item {
height: 100%;
min-height: 0; /* add this */
}
more info: https://developers.google.com/web/updates/2019/01/devtools
Blog by Jaga Santagostino.
Software consultant, polyglot developer, maker of things, lifelong learner.
ReactJS Milano & milano.dev organizer