No replies
Last seen: 10 years 10 weeks ago
Joined: 2007-08-10
Posts: 1
Points: 0


I am currently trying to implement a horizontal tabs menu in CSS, with a sub-navigation bar underneath that displays a set of options when you hover over a tab. I also want the options for the currently active tab (i.e. the section of the site you are on) to be displayed as a default when the pointer is not being hovered over any tab.

I found the following tutorial to implement this (HTML and CSS code are here):

The problem is, that method is for a left-aligned page. The website I am working on is fixed width and centre-aligned (although the tabs themselves are aligned to the left). This method uses absolute positioning for the sub-navigation bar but this obviously is not useful for my situation. Is there any way of accomplishing what I want to do in pure CSS? I've already tried Javascript but that gets messy with the mouseover and mouseout handlers...

Apologies if I have posted my request in the worng format, I hope a link to the code is sufficient...