[英]HTML button filling remaining width
我不是 HTML 专家,只是偶尔做一些有趣的编码。 我试图完成的是让“td”中的按钮填充剩余的宽度,尽可能简单。
<table width="100%">
<tr>
<td>My Text</td>
<td>
<input name="x" id="y" type="text" size="4" maxlength="4" />
<input type="button" onclick="..." value="BlaBla" />
</td>
</tr>
<tr>
<td>Other Text</td>
<td>
<input name="xx" id="yy" type="text" size="20" />
<input type="button" onclick="..." value="MoreBlaBla" />
</td>
</tr>
</table>
我试过宽度 100%,但这给了我一条额外的线。 我已经检查了一些答案,例如Help with div - make div fit the remaining width here,但由于我不是 HTML 方面的专家,所以它变得太复杂了。 猜猜有一个非常简单的解决方案。
尝试这个
<td>
<input name="x" id="y" type="text" style="float:left;" size="4" maxlength="4" />
<input type="button" onclick="..." style="float:left;width:70%" value="BlaBla" />
</td>
基本上,没有办法使用 HTML+CSS 来指定它。 在某些时候,几乎每个人都想要这个,但它并不存在。
如果您坚持使用 HTML+CSS,如果您以某种可预测的方式指定宽度(固定长度或百分比),那么您可以计算正确的百分比(或其他度量)来设置按钮宽度。 这可能是最好的方法。
如果这是不可能的,那么您的下一个选择是 javascript(您应该使用现在存在的众多库中的至少一个来增强它,以使 javascript 更易于使用)。
尝试这个:
<tr>
<td>My Text</td>
<td>
<input name="x" id="y" type="text" size="4" style="float:left;width:100px" maxlength="4" />
<div style="padding-left:100px"><input type="button" style="width:100%" value="BlaBla" /></div>
</td>
</tr>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.