Posted by Brian Cryer on 10/18/07 16:05

"Jonathan N. Little" <lws4art@centralva.net> wrote in message
news:64962$47177cfe$40cba7aa$31853@NAXS.COM...
> Brian Cryer wrote:
>> One of the websites I'm responsible for has a toolbar down the left hand
>> side, which contains within it amongst other things a number of drop down
>> list boxes. Depending on what the user selects a map or chart is drawn
>> using the options the user has specified.
>
> That's fine and the mystery URL is....?
>
>> I've hit a problem with Internet Explorer. The left hand toolbar has a
>> fixed width, and I constrain my drop down list boxes to that width. In
>> Firefox if the content is longer than the list box then you still get to
>> see all the content when you click on the box - but in IE its truncated.
>> For example:
>>
>> <select name="Select1" style="width: 10em">
>> <option>men, women and children</option>
>> <option>boys toys</option>
>> </select>
>>
>> The first option will be truncated in IE (the second option is short and
>> displays fine), but in Firefox is still fully visible when you click on
>> the list box and it opens (even though the width when collapsed is
>> constrained to 10em). I hope that's clear.
>
> Yep. IE will if your constrain the width of the parent SELECT then IE will
> also constrain the width of the child OPTIONs.
>
>> Its only recently that the content of these list boxes has grown. I don't
>> want to increase the available width because that impacts on other things
>> and I risk a complete page redesign (which I want to avoid). The client
>> is happy that when the list box is collapsed that the content is
>> truncated but wants to be able to see it in full when its expanded.
>>
>> Any ideas? or am I stuffed?
>
> Redesign. IE will not cooperate with what you are trying to do. In FF your
> can even specify the width of the OPTIONs, but will not happen in IE. For
> example I will also change the color of the text in the SELECT in relation
> to the OPTIONs
>
> select { color: blue; width: 10em; }
> select option { color: red; width: 50em; }
>
> In FF the droplist will be 10em wide and text blue when closed, the list
> expands to 50ems and the text is red when expanded.
>
> In IE the droplist will always be 10ems wide and the text red.

Thanks Jonathan. This makes sense. Lesson for my next project.

I'd rather avoid a redesign (not that it would take particularly long), but
it looks like I'll have to put that option to my customer.
--
Brian Cryer
www.cryer.co.uk/brian

[Back to original message]