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!

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.