CSS left menu layout problem

Question

Hi, I have a problem and I have no idea how to solve it. I have website with header, left-menu, content and footer. I used float as positioning scheme.

My problem is, I want left menu to adjust with text size of the hyperlinks. Normally, there would be no problem with this thanks to float, but to solve one problem in IE, I had to set exact size of the content, and I need to have fixed maximum page width as well, defined in pixels.

So, when increase text size of the menu item, it overflows the menu width and text gets separated into two lines instead of one. But I dont want this to happen, I want menu width to expand with text size.

Yes, text size relative units would solve my problem, but since I need to set maximum page width in pixels, and I need to have fixed width of content due to IE problem, I dont know how to do it. Thanks.

There is the link. But its old version without fixed content width.

Answer 1

Hi,

Add this to your stylesheet:

#left_menu ul li a
{
    font-size:48pt;
}

When I change the font size in #left_menu ul li a, the left menu automatically stretches or shrinks depending on the font size, making the content div smaller or larger automatically. Does this solve your problem?