CSS Tab Issue

[rgraves]

Hi,

I had a problem with pages that had a lot of tabs wrapping to the next line. This problem was fixed, but while the tabs don't wrap, all the other CSS formatting stops where the screen would normally end.

http://www.lib.uwo.ca:777/programs/philosophy

You'll notice if you view this page in 1024x768 resolution, the tabs stay on the same line (which is good), but the grey bar below the tabs, the header image and the footer all stop pre-maturely.

Any ideas on how to fix this? Most pages won't have this many tabs, but I want to make it look right for the odd publisher who needs to have more.

Rob

[Vidual]

The line that stops is the bottom border for:

ul .anchors tabs secondary

It stops because it is currently determined by the size of:

div #tabs-subjects-programs0-8 .fragment

This is currently set to 741px. If you increase that, the line will lengthen.

You could try to increase the size of the above element OR try to add
a z-index to the first element I mentioned and give it a value of 20 or something.

z-index:20;

That 'might' work.

To aid in your design work, get Firefox and download Web Developer.
Now right click on a web page and nav to
web developer--->information--->display element information
OR press ctrl+shift+f

This is absolutely invaluable to troubleshooting stuff like this.

Hope that helps.

[rgraves]

No luck.

I don't actually specify the width of ul.secondary anywhere. It just defaults to 100%. The width always remained at 100% of the viewable screen (i.e. what's viewable without horizontal scrolling).

I tried the following, based on a similar piece of code I was recommended to use in order to get the tabs to stop wrapping:

ul.secondary { display:inline; }

That solved the problem more or less for IE and FF but caused some odd issues in Opera and Safari, even when there were only a few tabs. The bottom border was too long in Opera and not far enough below the tabs in Safari.

[Vidual]

Only other thing I can think of doing is defining ul.secondary yourself. It's currently defaulted until you change it yourself.

I have just tried it on my server and it works.