我正在尝试布局一个表格(我知道网格可能效果更好但不想第三次更改所有内容)。我有2个相同的单元格,但是一个小于另一个。无论我做什么,无论我创建一个较小的类,还是使它们相等,总是会比另一个更大
.grid td.normal{
width: 100px;
}
.grid td.small{
width: 50px;
}

<tr>
<!--Section Search-->
<td colspan="1" class="normal">
<div class="form-row">
<form name="r" action="section.php" method="get" class="form-labels-on-toptabletry">
<label><span>Section:</span><br></label>
<select name="section">
<option value="">Select</option>
<option value="0">Unknown</option>
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
<option value=8">8</option>
<option value="9">9</option>
<option value="10">10</option>
<option value="11">11</option>
<option value="12">12</option>
<option value="13">13</option>
<option value="14">14</option>
<option value="15">15</option>
<option value="16">16</option>
<option value="17">17</option>
<option value="18">18</option>
<option value="19">19</option>
<option value="20">20</option>
<option value="21">21</option>
<option value="22">22</option>
<option value="23">23</option>
<option value="24">24</option>
<option value="25">25</option>
<option value="26">26</option>
<option value="27">27</option>
<option value="28">28</option>
<option value="29">29</option>
<option value="30">30</option>
<option value="31">31</option>
<option value="32">32</option>
<option value="33">33</option>
<option value="34">34</option>
<option value="35">35</option>
<option value="36">36</option>
</select><br>
<input type="submit" value="Search" class="form-buttons">
</form>
</div>
</td>
<!--Township Search-->
<td colspan="1" class="normal">
<form name="township" action="township.php" method="get" class="form-labels-on-toptabletry">
<label><span>Township:</span><br>
<input type="text" name="township"><br>
<input type="submit" value="Search" class="form-buttons">
</label>
</form>
</td>
<!--TD Search-->
<td colspan="1" class="normal">
<div class="form-row">
<form name="r" action="td.php" method="get" class="form-labels-on-toptabletry">
<label>
<span>Township Direction:</span><br>
<select name="td">
<option value="">Select</option>
<option value="0">Unknown</option>
<option value="N">North</option>
<option value="S">South</option>
</select><br>
</label>
<input type="submit" value="Search" class="form-buttons">
</form>
</div>
</td>
<!--Range Search-->
<td colspan="1" class="small">
<form name="range" action="range.php" method="get" class="form-labels-on-toptabletry">
<label>
<span>Range:</span><br>
<input type="text" name="range"><br>
<input type="submit" value="Search" class="form-buttons">
</label>
</form>
</td>
<!--RD Search-->
<td colspan="1" class="normal">
<div class="form-row">
<form name="rd" action="rd.php" method="get" class="form-labels-on-toptabletry">
<label><span>Range Direction:</span><br>
<select name="rd">
<option value="">Select</option>
<option value="0">Unknown</option>
<option value="W">West</option>
<option value="E">East</option>
</select><br>
</label>
<input type="submit" value="Search" class="form-buttons">
</form>
</div>
</td>
</tr>
&#13;
在片段上它看起来没问题,但这是我测试它时的样子: Different Size Inputs 有没有人知道为什么会发生这种情况?