I am starting a list of common and ridiculous bugs that Iāve found in different browsers along with quick fixes if I know of them. It will most likely grow over time as I find and remember more idiotic bugs.
IE 8
console.log()
causes JS errors
IE 10 & 11 (and maybe 9)
- I think CSS
calc()
works, but it doesn't seem to work if you do something liketransform: translateY(calc(100% - 50px));
which works in other browsers
Android 2 Stock Browser
(2.3.4 anyway, but really who even uses Android 2 anymore?)
- Canāt use CSS transforms on pseudo elements (
::before
and::after
) - Fixed positioning works like crap
overflow: scroll
doesnāt work
Mobile Safari
- Donāt even think about transitioning
visibility
on something that you're hiding and showing withopacity: 0; visibility: hidden;
because if you do, it will always remain hiddenā¦
Desktop Safari
- Maybe itās just me, but I feel like Safari 8 is just a huge pile of junk. Seriously, like 50 times a day it refuses to load a page and says the server cannot be found only to load it correctly if I refresh.
Chrome
- Tables apparently ignore
max-width
. Iām not sure if this is actually a bug, though, because it sounds like maybe Chrome does what the CSS spec says it should. Either way, itās annoying and dumb. - Iāve also noticed a lot of jankiness if you try to use fixed backgrounds in Chrome, especially if youāre on a retina Mac.
0
Cool post, man.