Work on the IE display problems
Checked the title bar display on IE6 and IE7, and they both show the same problem (the title is cut off halfway down, and the decorative bar below doesn't show).
Began by pruning some obsolete JavaScript code which was still there from the previous version of the layout (AssignIE6MenuHandler()
). This didn't help, but it needed doing anyway.
Next, I tried commenting out the <hr id="HeaderBorder>
, in case some of its oddities might be causing the problem -- we know IE can't handle <hr>
tags with image content or min-height. However, that had no effect either. The problem seems to be with the CSS of the <h1>
tag.
I tried removing the before
and after
pseudo-attributes -- again, IE doesn't support these -- but that made no difference.
Then I notices that a previous font-size
declaration for <h1>
set it at 190%
, which was then overridden in the title bar CSS by 250%
, marked !important
. Thinking there might be some odd interaction between these, I commented out the first one. No effect.
Finally, I commented out the line vertical-align: middle;
. That did the trick. It appears that when IE tries to align text to the middle, it projects it below the bottom of its bounding box, cutting it off half-way. The removal of that line didn't seem to make any difference to other browsers; I tested on Firefox, Opera, Konqueror and Safari. I've left the line commented out in the CSS, with an explanation. The site now looks reasonable on IE6 and IE7, although neither of them show the fleur-de-lys emblems or the row of decorative poultry below.
While testing on Safari, I noticed that the right-side fleur-de-lys is not spaced from the text, although the CSS code that places it specifies a space before it. It appears that Safari honours a space after generated content, but not before (so the fleur-de-lys on the left of the title does have the correct space on the right of it). However, testing on WebKit and Konqueror, both of which show the correct spacing, suggests that this is a temporary glitch in Safari and will be fixed at the next update.