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 (
::beforeand::after) - Fixed positioning works like crap
overflow: scrolldoesnāt work
Mobile Safari
- Donāt even think about transitioning
visibilityon 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.