Drop down menu

[matej.barac]

Hi,

I am trying to make a drop down menu using only CSS. I want to be able to set the width of the menu and don't want the width to be dependant of size of the menu option (width of the phrase). Also, is it possible to control the height of the menu?

This is the XHTML code (I am using 1.0 strict):

<div class="option">
<form name="navigation">
<select name="selectname" SIZE="1">
<option class="">not wide enough</option>
<option class=""></option>
<option class=""></option>
<option class=""></option>
</select>
</form>
</div>


And the CSS part:


div.option
{
position: absolute;
top: 10px;
left: 0px;
width: 520px;
height: 50px;
z-index: 3;
font-family: verdana, arial, helvetica, sans-serif;
font-size: 10px;
}

I am trying to avoid Javascript, but if this is not possible with CSS can someone tell how to do it with Javascript?

 

[CreativeLogic]

You're going to have to use some style on the actual select tag for the height and width.

 

[tony84]

im not sure about css
but as for the javascript:

<form name="jump">
<select name="menu" onChange="location=document.jump.menu.options[document.jump.menu.selectedIndex].value;" value="GO">
<option value="http://oooo">oooo</option>
<option value="http://iiii">iiii</option>
<option value="http://mmmm">mmmm</option>
</select>
</form>