- This topic has 6 replies, 3 voices, and was last updated 15 years, 8 months ago by
.
-
Posts
-
Hi,
I have a small problem.
I installed the Multi-Menu succesfully, but now my menu doesn’t look the same in Firefox and Explorer.
Check it out on http://www.koffie-weetjes.nl
It specificly concerns the ‘grandchildren’ or 3rd level menu items. For example when you follow "Koffie drinken" –> "Koffie zetten".
As you can see in Firefox, the grandchildren nicely appear under their parent.
But in Explorer, they appear almost totally on the right of the page.How can i change this so it looks the same in both browsers?
Thanks in advance for help!
Mar
I’m having exactly the same problem (I’m testing right now the css related to the home page of my site) http://www.donia.it/
I’m using wordpress 2.7 and the latest version of your great plugin.
I tried to remove the "margin-left" property to see how both firefox and explorer acted:
in firefox che 3rd level menu showed up over the 2nd level.
In explorer (7) it looked like there were a "margin-left: 80px"I really don’t know what to do.
I’ve also searched on this board but found no solution: someone had and <ul> in front of the script (not my case) someone put the script before the <body> tag (again, not my case)
Here’s my css :
#pixopoint_menu_wrapper1{
width:760px;
text-align: center;
}
#pixopoint_menu1
{
width:600px;
text-align: center;
margin-left: auto;
margin-right: auto;
z-index:1000;
}#suckerfishnav {
font-size:11px;
font-family:verdana,sans-serif;
font-weight:bold;
width:100%;
font-variant: small-caps;
letter-spacing: 2px;
z-index:1000;
}
#suckerfishnav, #suckerfishnav ul {
list-style:none;
line-height:30px;
padding:0;
border-top:4px solid #1c70b5;
margin:0;
width:100%;
font-variant: small-caps;
letter-spacing: 2px;
}
#suckerfishnav a {
display:block;
color:#dddddd;
text-decoration:none;
padding:0 10px 0 10px;}
#suckerfishnav li {
float:left;
padding:0;
}
#suckerfishnav ul {
position:absolute;
left:-999em;
height:auto;
width:150px;
font-weight:normal;
margin:0;
line-height:1;
border:0;
border-top:1px solid #666666;
}
#suckerfishnav li li {
width:150px;
border-bottom:1px solid #666666;
border-left:1px solid #666666;
border-right:1px solid #666666;
font-weight:bold;
font-family:verdana,sans-serif;
text-align: center;
}
#suckerfishnav li li a {
padding:4px 0 4px 0;
width:150px;
font-size:11px;
color:#dddddd;
}
#suckerfishnav li ul ul {
margin-top:-30px;
margin-right:0;
margin-bottom:0;
margin-left:140px;
visibility: visible;
z-index:1000;
width:150px;}
#suckerfishnav li li:hover {
background:#0b63ab;
}
#suckerfishnav li ul li:hover a, #suckerfishnav li ul li li:hover a, #suckerfishnav li ul li li li:hover a, #suckerfishnav li ul li li li:hover a {
color:#ffffff;
}
#suckerfishnav li:hover a, #suckerfishnav li.sfhover a {
color:#ffffff;
}
#suckerfishnav li:hover li a, #suckerfishnav li li:hover li a, #suckerfishnav li li li:hover li a, #suckerfishnav li li li li:hover li a {
color:#dddddd;
}
#suckerfishnav li:hover ul ul, #suckerfishnav li:hover ul ul ul, #suckerfishnav li:hover ul ul ul ul, #suckerfishnav li.sfhover ul ul, #suckerfishnav li.sfhover ul ul ul, #suckerfishnav li.sfhover ul ul ul ul {
left:-999em;
}
#suckerfishnav li:hover ul, #suckerfishnav li li:hover ul, #suckerfishnav li li li:hover ul, #suckerfishnav li li li li:hover ul, #suckerfishnav li.sfhover ul, #suckerfishnav li li.sfhover ul, #suckerfishnav li li li.sfhover ul, #suckerfishnav li li li li.sfhover ul {
left:auto;
background:#000000;
}
#suckerfishnav li:hover, #suckerfishnav li.sfhover {
background:#0b63ab;
}Koffie – you don’t seem to be using one of our menus.
Donia – Did you change anything in the CSS exported from the CSS generator? I tried your menu with the test.css file built in the plugin and it worked fine in Firefox 3.
Hi Ryan, I’ve changed colors, fonts and width, but the problem is not with firefox but with explorer!
I’ve also tried to use the pure css from the css generator but the problems still shows up.
Explorer shifts the submenu to the right.
No, it’s messed up in FF3 as well. I’ll check again, but I swear it worked fine when I used CSS straight from the CSS generator.
Hi Ryan, I don’t see it messed up in firefox (it’s a little shifted to the left but that’s because I had to find an arrangement between explorer shifting too much the submenu to the right)
My css is located in the theme file (I cannot use the style.php because I have a different theme for each page)
This is the css I have right now
#pixopoint_menu_wrapper1{
width:760px;
text-align: center;}
#pixopoint_menu1
{
width:580px;
text-align: center;
margin-left: auto;
margin-right: auto;
z-index:1000;
}#suckerfishnav {
font-size:11px;
font-family:verdana,sans-serif;
font-weight:bold;
width:100%;
font-variant: small-caps;
letter-spacing: 2px;
z-index:1000;
}
#suckerfishnav, #suckerfishnav ul {
list-style:none;
line-height:30px;
padding:0;
border-top:4px solid #1c70b5;
margin:0;
width:100%;
font-variant: small-caps;
letter-spacing: 2px;
z-index:1000;
}
#suckerfishnav a {
display:block;
color:#dddddd;
text-decoration:none;
padding:0 10px 0 10px;
margin:0;}
#suckerfishnav li {
float:left;
padding:0;}
#suckerfishnav ul {
position:absolute;
left:-999em;
height:auto;
width:150px;
font-weight:normal;
margin:0;
line-height:1;
border:0;
border-top:1px solid #666666;}
#suckerfishnav li li {
width:150px;
border-bottom:1px solid #666666;
border-left:1px solid #666666;
border-right:1px solid #666666;
font-weight:bold;
font-family:verdana,sans-serif;
text-align: center;}
#suckerfishnav li li a {
padding:4px 0 4px 0;
width:150px;
font-size:11px;
color:#dddddd;}
#suckerfishnav li ul ul{
margin-top:-30px;
margin-bottom:0;
margin-left:100px;
z-index:1000;}
#suckerfishnav li:hover, #suckerfishnav li.sfhover {
background:#1c70b5;
}
#suckerfishnav .current_page_parent, #suckerfishnav .current_page_ancestor, #suckerfishnav .current-cat-parent {
background:#1c70b5;
}
#suckerfishnav .current-cat, #suckerfishnav .current_page_item {
background:#1c70b5;}
#suckerfishnav li li:hover {
background:#1c70b5;
}
#suckerfishnav li ul li:hover a, #suckerfishnav li ul li li:hover a, #suckerfishnav li ul li li li:hover a, #suckerfishnav li ul li li li:hover a {
color:#ffffff;
}
#suckerfishnav li:hover a, #suckerfishnav li.sfhover a {
color:#ffffff;
}
#suckerfishnav li:hover li a, #suckerfishnav li li:hover li a, #suckerfishnav li li li:hover li a, #suckerfishnav li li li li:hover li a {
color:#dddddd;
}
#suckerfishnav li:hover ul ul, #suckerfishnav li:hover ul ul ul, #suckerfishnav li:hover ul ul ul ul, #suckerfishnav li.sfhover ul ul, #suckerfishnav li.sfhover ul ul ul, #suckerfishnav li.sfhover ul ul ul ul {
left:-999em;
}
#suckerfishnav li:hover ul, #suckerfishnav li li:hover ul, #suckerfishnav li li li:hover ul, #suckerfishnav li li li li:hover ul, #suckerfishnav li.sfhover ul, #suckerfishnav li li.sfhover ul, #suckerfishnav li li li.sfhover ul, #suckerfishnav li li li li.sfhover ul {
left:auto;
background:#000000;
}
#suckerfishnav li:hover, #suckerfishnav li.sfhover {
background:#14578f;
}[quote:2dobxvas]I don’t see it messed up in firefox (it’s a little shifted to the left[/quote:2dobxvas]
Yes, that was what I was trying to fix.
[quote:2dobxvas] but that’s because I had to find an arrangement between explorer shifting too much the submenu to the right)[/quote:2dobxvas]
I don’t provide free support for customised menus, particularly when I’m trying to fix them without knowing their modified as it takes too long to figure what is going wrong.
[quote:2dobxvas]My css is located in the theme file (I cannot use the style.php because I have a different theme for each page)[/quote:2dobxvas]
The built in stylesheet is added via the wp_head() function, so as long as you have that declared in all of your themes (most do) then it should work fine.
Actually … maybe you were intending to change the colours for each menu for each theme, which would make sense. Nice idea actually. I saw an example which does this a few days ago, it is subtle but provides a nice way to style each section of a site differently but yet keep a consistent method of navigation.
- You must be logged in to reply to this topic.