I have a leftnav with dark blue background and a 9px lighter blue
stripe on its right. The leftnav actually has three components: logo at
the top, menu area below it, and a fade below that.
I keep running into problems with white space appearing as I change
font size in my browser. I suspect I'm going about designing it wrong.
Here's how I'm doing it now.
The logo has the lightblue stripe as part of the image. This is
optional, as I have a version of the logo without the stripe and I can
use a 9px border instead.
The menu uses a lightblue border-right of 9px.
The fade has the lightblue stripe as part of the image, because the
lightblue has to fade along with the darkblue.
I've already got kludges in place to keep whitespace from appearing
between the three sections in the darkblue, but I can't seem to code or
kludge my way into keeping everything together. Just go to the site and
start sizing fonts and you'll see what I mean.
Ideally, someone tells me how to approach the whole problem differently
so that I don't have to have any negative margin kludges, but I'll take
whatever works at this point.
The stylesheet is here
Boise State University
IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/