PDA

View Full Version : list and drop down



mikacruz
Mar 12th, 2009, 02:00 PM
Hello all,
I'm using a script for drop down menu lists and although I figured out most of it now, some issues still remain mysterious to me.
For instance if you look at the display of the first list, the text is not centered within the borders and I dont see why at all.
Here is the htm link (http://europeoples.eu/index_t.html)

The css for the menu begins at line 161 of the css (http://europeoples.eu/style.css) .menu

Thanks for having a look! :-)

BoldUlysses
Mar 12th, 2009, 02:09 PM
I would highly recommend you ditch that method of making dropdown menus and consider this one (http://www.alistapart.com/articles/dropdowns). It's much simpler (especially the markup) and easier to deal with.

mikacruz
Mar 12th, 2009, 02:11 PM
:-) thanks,
I'm indeed happy to "ditch it"...

mikacruz
Mar 12th, 2009, 02:49 PM
I have put suckerfish instead, would you know why li ul is hidden behind my next divs? I have tried applying z-index to the ul and li but not working...

abduraooft
Mar 12th, 2009, 03:00 PM
Put some good background to avoid seeing through the <ul>

li ul {/*style.css (line 188)*/
background:#CCCCCC url(../../Business/SKIRESORT-JOBS/images/ddbg3.gif) no-repeat scroll left bottom;
border-right:1px solid #7D6340;
display:none;
font-weight:normal;
left:0;
padding:0.5em 0 1em;
position:absolute;
top:100%;
}

mikacruz
Mar 12th, 2009, 03:09 PM
even that, the text of drop down is hidden behind next divs (behind #right_col p and bg image

abduraooft
Mar 12th, 2009, 04:30 PM
I'd recommend you to correct your layout first in FF and then IE, so that let's find out where to apply z-index or something like that.

mikacruz
Mar 12th, 2009, 05:42 PM
what do you mean by correcting? the layout is correct, and the codes validate. Is it in theory just a matter of correct z-indexing?
thanks Abdu

abduraooft
Mar 12th, 2009, 06:02 PM
Umm.. now try

#menu_bar {/*style.css (line 25)*/
background:transparent url(/images/menu_bar.gif) repeat scroll 0;
height:45px;
position:relative;
z-index:10;
}
#main {/*style.css (line 37)*/
background:transparent url(/images/bg_main_l.gif) repeat-y scroll 0;
overflow:hidden;
width:812px;
position:relative;
z-index:1;
}