我正在尝试在标签和复选框之间创建空间。如果我使用类.Test
,那么它会在所有项目的标签和复选框之间产生很大的间隙。但我想保留第一个项目,但在第二个和第三个标签中创造空间。我试过label>#test1Label
,但它不起作用。我也试过#test1Label
,但还是没用。
JavaScript
$(".Test").parent().css({"width":"160px","height":"25px"});
$("label>#test1Label").css({"width":"550px","height":"25px"});
$("label>#test2Label").css({"width":"550px","height":"25px"});
HTML
<tr>
<td nowrap="" style="width: 160px; height: 25px;">
<span class="Test">
<label for="Test1" id="Test1Label" style="border: 1px solid rgb(204, 204, 204); border-radius: 3px; padding: 2px;">Testing </label>
</span>
</td>
<td align="left" width="100%" id="TD1">
<input class="pro" type="CHECKBOX" name="ob" value="Ind" id="pro" onclick="" autocomplete="off">
</td>
</tr>
<tr>
<td nowrap="" style="width: 160px; height: 25px;">
<span class="Test">
<label for="Test2" id="Test2Label" style="border: 1px solid rgb(204, 204, 204); border-radius: 3px; padding: 2px;">Please select Testing 1 </label>
</span>
</td>
<td align="left" width="100%" id="TD1">
<input class="pro" type="CHECKBOX" name="ob" value="Ind1" id="pro" onclick="" autocomplete="off">
</td>
</tr>
<tr>
<td nowrap="" style="width: 160px; height: 25px;">
<span class="Test">
<label for="Test3" id="Test3Label" style="border: 1px solid rgb(204, 204, 204); border-radius: 3px; padding: 2px;">Please select Testing 2 from </label>
</span>
</td>
<td align="left" width="100%" id="TD1">
<input class="pro" type="CHECKBOX" name="ob" value="Ind2" id="pro" onclick="" autocomplete="off">
</td>
</tr>
尝试添加一个新的<td>
元素,其中div位于输入和标签之间,如下所示:
<td nowrap="" style="width: 160px; height: 25px;">
<span class="Test">
<label for="Test2" id="Test2Label" style="border: 1px solid rgb(204,
204, 204); border-radius: 3px; padding: 2px;">Please select Testing 1
</label>
</span>
<td>
<div class="label-space"></div>
</td>
<td align="left" width="100%" id="TD1">
<input class="pro" type="CHECKBOX" name="ob" value="Ind1" id="pro"
onclick="" autocomplete="off">
</td>
然后通过css向div添加宽度:
$(".label-space").css({"width":"15px"})