It’s not all black & white

A recent discovery amused me somewhat; while trying to resolve an issue at CSSCreator with a border not appearing on an element I discovered that IE plays an ‘our dictionary is the real one’ game with keywords.

I couldn’t see what the problem was it was a simple bit of code and the element in question had a fixed height (greater than the nested children) and width, so no floated child element problems in any browsers; in Firefox there were no problems displaying a nice fat border however in IE6 and 7 zilch, nada, zero.

The border was described using keywords as opposed to hex values or RGB ones; now I very seldom if ever use keywords for colours (which might explain why the solution eluded me for so long), yet this wasn’t my layout and keywords as we know do work without a problem? After messing around for a while and to the extent that I had to replicate the code locally to see it in action, I was getting frustrated, I had discounted and cleaned up the markup errors, and it damned well ought to work!! Then something at the back of my mind squirrelled away for reference was a loose fragment of info about the fact that we (the British) spell the word as ‘Grey’ while our American cousins spell it ‘Gray’ why oh why oh why? So I decided to change the spelling, silly really ,what for, it worked in FF; guess what.. yes it worked the border magically appeared.

Internet Explorer or more correctly Microsoft have decided that Gray is Gray and that Grey is not Gray; It’s at times like this that I feel in dispair of life , of coding, of… πŸ™‚

So a warning; avoid keywords or if using them play safe and spell them incorrectly (or correctly depending on what side of the pond you are on) πŸ™‚

Thank you MS.
N.B. this was not tested to see whether any other browsers were this particular over spelling.

Comments are closed.