I want to create suckerfish (superfish really) drop down menus that are wider when the content in them is wide and narrower when the content in them is narrow. (not fixed width, in other words) I got it working in non-IE browsers...but i'm stuck in IE

Here is some css i'm using...


.sf-menu  ul {
    color:#4A0000;
    background-color: #F4F1E9;
    border:1px solid #D1C4B6;
    
    float:left;
    list-style-type:none;
    margin:0px 0px;
    padding:0;
    z-index:1000;
}

.sf-menu  ul li {
    display:block;
    width:100%;
}

.sf-menu a{
    text-decoration:none;
    float:left;
    display:block;
    font-family:"Trebuchet MS",Arial,Helvetica,sans-serif;
    font-size:100%;
}

.sf-menu a.level1 {
    color:#D1C4B6;
    padding:13px 17px;
}

.sf-menu a.level1:hover{
    text-decoration:underline;
}

.sf-menu li.level2{
    border-top:1px solid #D1C4B6;
}
.sf-menu li.level2:hover{
    color:#F4F1E9;background-color: #4A0000;
}
.sf-menu a.level2{
    padding:4px 17px;
    white-space:nowrap;
}
.sf-menu li.level2:hover a{
    color:#F4F1E9
}

1 answer

kemie 247
0
points

Actually superfish has built in functionality for that, called supersubs.

check out this demo

Answered almost 8 years ago by kemie