In creating a particularly complicated styling for a project I'm working on, I've come across a corker of a bug in IE6.
UK EVENTAttend ffconf.org 2024
The conference for people who are passionate about the web. 8 amazing speakers with real human interaction and content you can't just read in a blog post or watch on a tiktok!
£249+VAT - reserve your place today
if (ie6) border-color = color
If you're using td { border-color: transparent; }
(which I have to create this specific project effect), then IE6 will literally replace this with the colour of the text in the td
.
I only noticed this because the colour of the text in my td
is different to the background colour - and wham! In IE6, the border colour is taken from the text colour if borders are transparent.
See the example
View the example in Firefox, then view it in IE6 - classic!
https://jsbin.com/iquyi (to edit: https://jsbin.com/iquyi/edit)
Challenge?
If anyone is up to the challenge, have a crack at getting the transparency working (note that this needs to be on a td
and not a div
- for which I've seen a fix already).
The long solution is to use border-color: #fff;
- but it not as easy as that in my situation since I got lots of different colours to deal with, and it would (and probably will) require a lot of additional, conditional, CSS.