[thelist] [thelist]Drop down form thing
Aylard JA (James)
jaylard at equilon.com
Thu Jul 20 18:30:55 CDT 2000
Elizabeth,
> I am creating a page with three separate drop down form thingys
...each
> with 8 or so menu items. ...all lined up nice and happy. Client wants
> them all to be the same "width" ...which seems to be determined by the
> length of the longest menu item within the drop down form thingy. Anybody
> know of a way to get them all looking pretty and same size?
Two ways:
1) Setting a width using style sheets, e.g.:
<style type="text/css">
select {
width: 150px ;
}
</style>
However, this has some serious downsides: IE sometimes won't render
the control properly, apparently due to some kind of bug, especially if
absolute positioning is used to place the <select>; and Netscape 4 totally
ignores the setting.
2) Plain old HTML. Determine how wide the widest option value will appear,
and then create an empty first option for each control with enough
non-breaking spaces ( ) to match or slightly exceed that longest value.
Apply that empty option element to each of your selects, and you'll be in
business. Should work cross-browser.
<select>
<option value=""> </option>
<option value="1">One</option>
<option value="2">Two</option>
<option value="3">Three</option>
</select>
<select>
<option value=""> </option>
<option value="A">Aay</option>
<option value="B">Bee</option>
<option value="C">See</option>
</select>
etc.
hth,
James Aylard
jaylard at equilon.com
More information about the thelist
mailing list