Axe Rescheek sub menus

[fernt]

I'm currently hosting my test site locally, so forgive me for not being able to provide a better example than my screenshot and the Edugeek Joomla demo site.

 

Using the Axe Rescheek theme, does anybody know of a CSS fix so that sub menus within the main menu at the top?

 

To use the Edugeek Joomla demo site as an example, let's say that I want to create a sub menu when I hover over the History option on the Curriculum menu to show 3 more options - say, Facilities, Homework and Timetable.

 

I know how to set this up through the backend, but when I try it out (and in all browsers), these 3 options would appear elsewhere - in this case, probably floating just over the News menu option.

 

There's a better example in my screenshot. I want to be able to hover over Sales in the SPA menu and have the Instrument Sales option appear just to the right, instead of over the Contact Us menu.

 

I presume other people have had this problem? How have people got around this? Any ideas for a CSS fix?

 

Thanks in advance.

[DirtySnipe]

I have noticed that the submenus appear but they are out of alignment (too high).

http://www.console-gamers.co.uk/menu.jpg

Edited February 19, 2009 by DirtySnipe

[Edu-IT]

On a slightly related note has anyone worked out how to use a full width header without breaking the navigation in IE6?

[fernt]

Thanks DirtySnape - your screenshot has made me realise that the problem is not as bad as I'd originally thought.

 

My screenshot shows a bad example, and if I'd been a bit less lazy and had constructed a fuller menu like yours then I would've noticed that the sub menu isn't actually too far away from where I want it to be.

 

I'll post a fix when I have a proper look at the CSS, but thankfully it's going to be a lot easier than I'd envisaged.

[DirtySnipe]

Im still having submenu issues.

 

Any fix?

[fernt]

Im still having submenu issues.

 

Any fix?

I've completely redesigned my menus a lot since I first posted in February, but to get your alignment right you need to fiddle with the first and last numbers in the following in suffix.css:

 

#topmenu ul li ul ul {

margin: -40px 0 0 16em;

}

 

What you need to change them to will depend on any other alterations you've made to the design of your menus (such as the width of each column), but with a bit of experimentation you'll see what's what.

 

This article seems to have been used as a basis for the menu system and can help you understand how it's been built up:

 

Son of Suckerfish Dropdowns | HTML Dog