|
|
 |
|
|
Thread Tools | Display Modes |
Aug 30th, 2007, 6:59 PM
|
#1 |
|
Programmer
Join Date: Dec 2006
Posts: 49
Rep Power: 0
 |
Help with .css file and suckerfish menu
hey everybody. I am having a slight problem. I am currently wrapping up a website that sells Hookah. However I am having a huge problem formatting a few links. On the main site there are four pictures which say "Hookah," "Sheesha", "Other Products", etc. When you scroll over these pictures a Suckerfish menu pops down and gives you the choice of an item to select. The Items in the menu are all over the place. The first line has "All HookahTraditional Hookah" and the second line has "Double Hose HookahSingle Hose Hookah.I want it to be in order and one selection be on top of the other such as:
"All Hookah Traditional Hookah Double Hose Hookah Single Hose Hookah etc but I can't for the life of me get it to format correctly. I have a .css file in which I have formatted the suckerfish box but i have adjusted just about everything (changing margin, left, top, display, etc) to no effect. Here is my .css file if you want to take a look /* StyleSheet for SuckerFish dropdown menu */
ul { /* all lists */
padding: 0;
margin: 0;
list-style: none;
z-index: 20;
}
li.level1 {
/* first level list items */
float: left;
position: relative;
display: table;
background: no-repeat right
center;
font-size: .8em;
padding-top: 5px;
width: 20%;
margin-bottom: 10px;
}
li.ListDivider { /* first level list item divider */
float: left;
position: relative;
display: table;
margin-right: 10px;
z-index: 200;
}
li ul { /* second level lists */
display: block;
position: relative;
top: 1.2em;
left: 0;
margin-left:auto;
margin-right:auto;
background-color: #4d1083;
padding: 3px;
padding-top: 6px;
border-bottom: solid 1px #8c6ea7;
/*min-width:5em; width:auto !important;width:5em; Min-width hack*/
z-index: 0;
}
li.level2 { /* second level list items */
position: relative;
width: auto;
/*changed z-index: 200;*/
}
li>ul { /* to override top and left in browsers other than IE, which will position to the top right of the containing li, rather than bottom left */
top: auto;
left: auto;
}
li:hover ul, li.over ul { /* lists nested under hovered list items */
display: block;
}I have a Master.master file which I have coded in the links and I was thinking I could put a <br> into the HTML after each line but I have tried it and it doesn't work either! <ul id="ctl00_MainMenu1_nav" class="style6"><li class="level1"><a class="MenuLink"><center> <img alt="Hookahs" src="images/NavLinks/Hookaslinksv3.png" width="150" height="70" /></center></a><ul><li class="level2"> <a class="MenuLink" href="http://www.bluesmokehookah.com/Collection.aspx?id=58"> All Hookahs</a></li><li class="level2"> <a class="MenuLink" href="http://www.bluesmokehookah.com/Collection.aspx?id=7"> Exotic Hookah </a></li><li class="level2"> <a class="MenuLink" href="http://www.bluesmokehookah.com/Collection.aspx?id=6"> Modern Hookahs </a></li><li class="level2"> <a class="MenuLink" href="http://www.bluesmokehookah.com/Collection.aspx?id=10"> Traditional Hookahs </a></li><li class="level2"> <a class="MenuLink" href="http://www.bluesmokehookah.com/Collection.aspx?id=40"> Single Hose Hookahs </a></li><li class="level2"> <a class="MenuLink" href="http://www.bluesmokehookah.com/Collection.aspx?id=42"> Double Hose Hookahs </a></li><li class="level2"> <a class="MenuLink" href="http://www.bluesmokehookah.com/Collection.aspx?id=41"> Three and Four Hose Hookahs </a></li><li class="level2"> <a class="MenuLink" href="http://www.bluesmokehookah.com/Collection.aspx?id=63"> Rotating Hookahs </a></li></ul></li><li class="level1"><a class="MenuLink"> |
|
|
|
| Bookmarks |
| Currently Active Users Viewing This Thread: 1 (0 members and 1 guests) | |
| Thread Tools | |
| Display Modes | |
|
|
Similar Threads
|
||||
| Thread | Thread Starter | Forum | Replies | Last Post |
| Help with drop down menu, suckerfish, .css file | csrocker101 | ASP | 0 | Aug 30th, 2007 2:33 PM |
Linear Mode
