homepage Welcome to WebmasterWorld Guest from 174.129.80.166
register, free tools, login, search, subscribe, help, library, announcements, recent posts, open posts,
Accredited PayPal World Seller

Visit PubCon.com
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: DrDoc

CSS Forum

    
Horizontal suckerfish menu appears vertical in IE7
Horizontal suckerfish menu appears vertical in IE7
nickdeheer




msg:4091356
 12:30 pm on Mar 4, 2010 (gmt 0)

Hi,

I am new on this forum, but I saw a lot of material about the Suckerfish menu inside Joomla. Unfortunately this information couldn't help me.

For my site I am using the suckerfish menu horizontally. Unfortunately, we I run the site in compatibility mode or in IE7, the website is distorted by the menu showing up vertically.

This is the CSS code for the menu:

.topmenu ul{padding:0;margin:0;}

.topmenu ul li {float:left;list-style: none;}

.topmenu ul li a:link, .topmenu ul li a:visited {color:#111;text-decoration: none;display:block;padding:5px;margin:3px;}

.topmenu ul li a:hover {color:#111;}

.topmenu ul li#current a:link, .topmenu ul li#current a:visited {color:#111;}

.topmenu ul li#current a:hover {color:#111;}

.topmenu {
z-index:100000;
float:left;
margin-left:30px;
margin-top:22px;
border-bottom:1px solid #a8a69d;
display:block;
position: relative;
}

.topmenu ul {
margin-bottom:-1px;
float:left;
}

.topmenu ul li a:link, .topmenu ul li a:visited {
color:#787772;
text-decoration: none;
display:block;
padding:5px 10px;
margin:0px;
border:none;
}

.topmenu ul li a:hover {
color:#111;
}

.topmenu ul li#current a:link, .topmenu ul li#current a:visited, ul#nav li ul li a:link, ul#nav li ul li a:visited, ul#nav li.active ul li a:link, ul#nav li.active ul li a:visited {
border-bottom:3px solid #a8a69d;
color:#111;
}

.topmenu ul li#current a:hover, ul#nav li.active ul li a:hover, ul#nav li ul li a:hover {
color:#111;
}

.footer a:link, .footer a:visited {
color:#a8a69d;
text-decoration: none;
border-bottom:1px dotted #a8a69d;
}

.main ul.menu {
padding:0;
margin:0;
}

.main ul.menu li{
padding:0;
margin:0;
list-style: none;
}

.main ul.menu li a:link, .main ul.menu li a:visited{
display:block;
border-bottom:1px solid #c1c0be;
color:#dfdfdf;
padding:5px 0 5px 5px;
}

.main ul.menu li a:hover{
color:#fff;
border-bottom:1px solid #dfdfdf;
background-color: #c1c0be;
}


Could anyone please help me?

Thanks,
Nick

[edited by: eelixduppy at 9:48 pm (utc) on Mar 11, 2010]
[edit reason] no URLs, please [/edit]

 

MarkFilipak




msg:4092955
 4:31 pm on Mar 7, 2010 (gmt 0)

Could anyone please help me?
I doubt it. I only use absolutely positioned DIVs for menu items. List element behavior is notoriously browser-specific because the defaults are under-specified in the CSS spec. Good luck.
Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About
© Webmaster World 1996-2014 all rights reserved