Why the input and the select do not get the same width?
Posted
by Bytecode Ninja
on Stack Overflow
See other posts from Stack Overflow
or by Bytecode Ninja
Published on 2010-06-11T05:52:08Z
Indexed on
2010/06/11
6:03 UTC
Read the original article
Hit count: 182
I have a table with two rows. The first row contains an input
and the second row contains a select
. Even though I have set their widths to be 100%, the select box is a few pixels smaller than the input. Any ideas why is this so and how can I set their widths to be equal to each other and as big as possible (e.g. %100) in a way that works across all (A-grade) browsers?
<table width="100%" style="margin-top: 5px;">
<tr>
<td width="35"><label for="desc">Description</label></td>
<td>
<input type="text" style="width: 100%;" name="desc" id="desc" />
</td>
</tr>
<tr>
<td width="35"><label for="group">Group</label></td>
<td>
<select id="group" name="group" style="width: 100%; line-height: 17px;">
<option value="val">name</option>
</select>
</td>
</tr>
</table>
© Stack Overflow or respective owner