Forum Moderators: not2easy

Message Too Old, No Replies

Adjusting the width of a form option element using CSS

It works in Firefox...just not IE

         

gms3651

12:44 am on Oct 20, 2007 (gmt 0)

10+ Year Member



Hello,
Below is my form and CSS:

<div id="quicksearch">
<form id="form1" name="form1" method="post" action="/form">
<select name="size" style="width:90%" class="listmenu">
<option value="1">My First Option</option>
<option value="2">My Second Option</option>
</select>
</form>
</div>

#quicksearch form option {
width:300px;
}

/////////////

When I look at this form is Firefox...my option's are the correct width (300px). However, when I look at my option elements in IE the width is the same as my select element. I can't increase the size of my select element..it's as big as my template will allow. Is there anyway is CSS that I can get my option elements to be wider than my select element...in IE?

Thanks

Marshall

4:28 am on Oct 20, 2007 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



I cannot say I have set option width with CSS, but you may actually have to do this:

#quicksearch form select {
width:300px;
}

Marshall

gms3651

1:50 pm on Oct 20, 2007 (gmt 0)

10+ Year Member



Mashall,
I can't modify the width of my select box to 300px, beause it's contained within another div that has a width of 200px. If I set the width to 300px then the select box will overflow. I need to be able to expand the width of my option elements whenever the dropdown box is selected for that element, but keep the select element width the same.

Thanks