Html CSS-按钮没有';t填充表格单元格
我正在使用Html CSS-按钮没有';t填充表格单元格,html,css,Html,Css,我正在使用来布局一个标准的HTML联系人表单。让我们不要讨论使用表的优点,因为HTML不应该是关于表示的,而应该是关于结构的(这就是为什么我认为它是合理的) 尽管如此,以下是我正在使用的标记和CSS(由ASP.NET MVC生成): 然而,它看起来是这样呈现的: 为什么元素没有水平填充单元格?我想您可能在寻找,它决定了在计算宽度/高度时是否添加或排除边距/填充 框大小:边框框 这应该允许您设置宽度/高度的百分比,它将填充而不会溢出 编辑:默认情况下,该按钮处于启用状态(如果检查图元,您将看到
来布局一个标准的HTML联系人表单。让我们不要讨论使用表的优点,因为HTML不应该是关于表示的,而应该是关于结构的(这就是为什么我认为它是合理的)
尽管如此,以下是我正在使用的标记和CSS(由ASP.NET MVC生成):
然而,它看起来是这样呈现的:
为什么
元素没有水平填充单元格?我想您可能在寻找,它决定了在计算宽度/高度时是否添加或排除边距/填充
框大小:边框框
这应该允许您设置宽度/高度的百分比,它将填充而不会溢出
编辑:默认情况下,该按钮处于启用状态(如果检查图元,您将看到浏览器已添加该图元)。可以将其添加到文本区域和输入字段中,使其与按钮匹配
如果你看你的屏幕截图。输入字段超出了TDs,按钮似乎是唯一真正起作用的按钮。我想您可能在寻找,它决定了在计算宽度/高度时是否添加或排除边距/填充 框大小:边框框 这应该允许您设置宽度/高度的百分比,它将填充而不会溢出 编辑:默认情况下,该按钮处于启用状态(如果检查图元,您将看到浏览器已添加该图元)。可以将其添加到文本区域和输入字段中,使其与按钮匹配
如果你看你的屏幕截图。输入字段超出了TDs,按钮似乎是唯一真正起作用的按钮。David我查看了您的html,并基于它创建了一个。然后我修改了你的css以使用你正在寻找的。虽然它应用于DOM上的其他对象,但您可能希望将它提取到自己的类中,仅用于文本区域。David我查看了您的html并基于它创建了一个。然后我修改了你的css以使用你正在寻找的。虽然它应用于DOM上的其他对象,但您可能希望将其提取到自己的类中,仅用于文本区域。将其添加到
按钮
规则中没有任何区别(我也使用了供应商前缀)。对不起,我是想让您将其添加到输入字段中。它已经在按钮上了(在编辑中抛出)。我将你的答案标记为已接受,因为你是第一个-即使我一开始没有正确地解释它。将它添加到按钮
规则中没有任何区别(我也使用了供应商前缀)。对不起,我是想让你将它添加到输入字段中。它已经在按钮上了(在编辑中抛出)。我将你的答案标记为已接受,因为你是第一个-即使我一开始没有正确解释它。啊,谢谢!但是框大小
属性是新的。我们将如何在IE6天内解决此问题?啊,谢谢!但是框大小
属性是新的。我们如何在IE6天内解决这个问题?
<table class="fieldTable">
<tbody>
<tr>
<th><label for="Name">Your name</label></th>
<td><input id="Name" name="Name" type="text" value="" /></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<th><label for="EmailAddress">Your e-mail address</label></th>
<td><input id="EmailAddress" name="EmailAddress" type="text" value="" /></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<th><label for="MessageBody">Message</label></th>
<td><textarea cols="30" id="MessageBody" name="MessageBody" rows="6"></textarea></td>
</tr>
<tr>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td><button type="submit"><span>Send Message</span></button></td>
</tr>
</tbody>
</table>
.fieldTable th {
text-align: right;
font-weight: normal;
vertical-align: top;
padding: 0.25em;
padding-right: 0.5em; }
.fieldTable input,
.fieldTable textarea,
.fieldTable button {
width: 100%; }
input, textarea, button {
border: 1px solid #999;
padding: 0.5em;
border-radius: 5px;
-webkit-box-shadow: 0px 0px 7px 3px #c4c4c4;
box-shadow: 0px 0px 7px 3px #c4c4c4; }
button { background: #DDD; position: relative; }
button:hover { background: #FFF; }
button:active span { position: relative; top: 2px; left: 2px; }
tr { outline: 1px solid blue; }
td { outline: 1px solid red; }