Today, I received a bug report about brackets being broken at some zoom levels in Chrome.
Well, actually the report was just, “bracket lines look rly f***** on my laptop.” (no kidding!) My first question was, “are you at 100% zoom?” The answer was, no, 80% zoom. Okay, brackets don’t work at 80% zoom. Maybe this is unfixable. Some complicated things just don’t work if you change the zoom level. I tried to reproduce and was unable to.
Then, just for fun, I zoomed out even more, and at 67% zoom I COULD reproduce! Interesting.
[3:51 PM] River: oh at 67% they are weird
[3:51 PM] River: oh huh ig they like, don’t fit ish
[3:51 PM] River: LOL they are
[3:51 PM] River: wait
[3:51 PM] River: omg
[3:52 PM] River: HAHAHAHAAHAHAHAHAAHA
[3:52 PM] River: HAHAAHAHAHAAHAHAHAHAHAAHAHAAHAHAAHAAH
[3:52 PM] River: ok
[3:52 PM] River: i fixed it
Remember how our brackets work? The lines are created in two parts, a
::before and an
::after. These two parts are placed next to each other in the
bracket-line class. And, well, I guess at some nonstandard zoom levels, Chrome’s renderer makes the lines too big for the column, and wraps them. Hah!
Could I fix this with a
Yep, that fixed the issue. All better now!
::afterpseudoelements (really wasn’t sure if it was going to work at first when I tried it).
- Always ask someone what zoom level they’re at when you get a really strange bug report like this (but actually sometimes they’re unfixable).