Support for Drupal 7 is ending on 5 January 2025—it’s time to migrate to Drupal 10! Learn about the many benefits of Drupal 10 and find migration tools in our resource center.The 33-34-33 layout is broken in IE11. Demo of this at https://tugboat-aqrmztryfqsezpvnghut1cszck2wwasr.tugboat.qa/node/60
| Comment | File | Size | Author |
|---|---|---|---|
| #3 | Screenshot 2021-05-03 at 09.24.49.png | 169.12 KB | Gauravvvv |
| #3 | Screenshot 2021-05-03 at 09.22.15.png | 148.82 KB | Gauravvvv |
| #2 | 3211888.patch | 1.23 KB | mherchel |
| chrome-lb.png | 42.12 KB | mherchel | |
| ie11-lb.png | 112.92 KB | mherchel | |
Comments
Comment #2
mherchelThe calculations within
core/themes/olivero/css/layout/layout-builder-threecol-section.pcss.cssgive an inside margin of 36px between each region. The flex-basis should calculate tocalc(33% - 24px).Because we're using decimals, in our calculations, it ends up as
calc(33% - 23.976), which is obviously less than 24.The weird thing is that it only affects IE, and it also only happens when the pxtorem postCSS plugin is enabled which is why I didn't catch that during development.
Either way, the fix is super simple: change the
0.666to0.667.Patch attached.
Comment #3
Gauravvvv CreditAttribution: Gauravvvv at OpenSense Labs commentedThe 33-34-33 layout is broken in IE11 is fixed now. Adding screenshots of chrome and IE11 for reference.
Marking as RTBC.
Comment #6
lauriiiNice catch! Committed d672604 and pushed to 9.3.x and 9.2.x. Thanks!