PDA

View Full Version : Controlling width of form elements


Madge2
February 23rd, 2007, 09:01 PM
Hi

I am creating a very simple website which includes order forms. They in turn include drop-down controls for selecting from various colourway options like this:

First item:

<input type="hidden" name="id" value="1234" />
<select name="item">
<option value="choose colour" />choose colour
<option value="white" />white
<option value="ivory" />ivory
</select>

Second item:

<input type="hidden" name="id" value="5678" />
<select name="item">
<option value="choose colour" />choose colour
<option value="white" />white
<option value="aubergine" />aubergine
</select>

It all functions fine but the boxes shrink or expand horizontally according to the length of the option values so the second box which includes the longer word "aubergine" would be wider than the first box. This is making my page look rather untidy. It is only a cosmetic issue, but I would like to insert code which maintains the width of the controls to whatever will be the widest needed. I have looked in many reference books and can find nothing. Surely this is possible?

FrEaKmAn
February 23rd, 2007, 10:22 PM
hm, if I understand you, you want that drop down boxes are same size? you can simply set width in select tag:

<select name="item" style="width: 100px;">

where 100px is the value that you can change...

Madge2
February 23rd, 2007, 11:15 PM
Wow! That was easy (and quick). I have looked in so many books for that simple solution without success. Many thanks.