Submenu offset of the rightmost menu item

Hi, can't fix a bug in the main menu/sub menu. If I hover or move over the rightmost main menu item the appearing submenu has a offset of approx. 100px to the left. That depends of course also on the width of the browser window. But although the whole site is completely visual including a border/margin the submenu appears displaced...

Please help. Thanks in advance.

screenshot_submenu.jpg

The standard width of the site is 1100px.

anyone out there?

Can you please post a link to your website if its online. Thank you.


See you around...

http://www.lisanum.de

Which browser are you using as I didn't see any problems with Firefox.

See you around...

normally Safari for OS X. But the same offset in Firefox (version 14.0.1) and Chrome (version 21.0.1180.79). I'm not sure if I pointed out clearly the misbehavior of the main menu/sub menu. If you click e.g. at the main menu "Leistungen" the submenu appears straight under the main menu point. But not if you click at "Kontakt" (the rightmost menu point). There is an offset to the left, depending of the width of the browser window.

safari.png

firefox.png

chrome.png

I guess programmers done it that way so menu is visible when browser view is smaller then template width.
You can enforce original layout by using below css code in css/override.css and enable css override from template settings > advanced settings > css override "on".

Code: Select all

#gkMainMenu > div > ul > li > div.childcontent { margin-left:35px!important;}


Also your home menu > sub menu is out of line, use below css code

Code: Select all

.first div.childcontent { margin-left: 15px !important;}


See you around...

thank you for your help. this is the solution. Personally I find the old behaviour better, but my client wants the override solution...

Also your home menu > sub menu is out of line, use below css code

Code: Select all

.first div.childcontent { margin-left: 15px !important;}


I can't find this wrong code line. Where is it?

That line is a custom css which you can add in your override.css. If you don't see any problem at the moment don't use it.

See you around...