Cisco_Kid wrote: I have been working on the .com site mentioned in the previous posts in this thread and would like some feedback on the current look and such things.
The multiline section headings in your menu are unreadable at my font size, because the white text overruns into a white background once it goes past your 25-pixel background image. They also clip when collapsed, because the CSS gives
div.sdmenu div.collapsed a height of 25 pixels. You cannot assume that I have a certain font size or that my browser won’t wrap the lines and go past 25 pixels. (I’ve temporarily loaded
a screenshot, which represents both Gecko 20080528 and WebKit r29752 on GNOME. If you don’t have this problem, you should be able to reproduce it by increasing the font size.)
Give your headings a background
color to go with the background
image:
Code: Select all
div.sdmenu div {
background: #393939 url(title.gif) repeat-x;
}
div.sdmenu div:first-child {
background: #393939 url(toptitle.gif) no-repeat;
}
(#393939 is what the GIMP said the bottom-most pixel was in
title.gif , and I got rid of the overflow on purpose.)
In the collapsed state, kill the links entirely instead of covering them up with low height. Instead of:
Code: Select all
div.sdmenu div.collapsed {
height: 25px;
}
Use:
Code: Select all
div.sdmenu div.collapsed a {
display: none;
}
The usual warnings: I only tested it in Gecko and WebKit, I haven’t had enough sleep to think clearly, test it locally first, etc. I’ll have a harder look this weekend. In the mean time, you might want to put your doctype before anything else in the page to keep browsers from using
quirks mode. I would also change the doctype to HTML 4.01
Strict and
run it through the validator.
Archived topic from Anythingforums, old topic ID:3582, old post ID:66383