1

尝试使用 HTML 格式化字段。我有以下内容：

<table style="width: 100%;" cellpadding="0px" cellspacing="0px">
    <tr>
        <td style="width: 65px;">
            <asp:Label ID="lblKeywords" runat="server" Text="Keywords"
                 AssociatedControlID="txtKeywords" Font-Bold="true"></asp:Label>
        </td>
        <td>
            <asp:TextBox ID="txtKeywords" Width="100%" runat="server"
                 MaxLength="256" placeholder="Use comma to seperate keywords." />
        </td>
    </tr>
</table>

检查结果，文本框txtKeywords比其单元格长 4 个像素。

我假设那些是边框的 4 个像素；处理这个问题的最佳方法是什么？

4

2 回答 2

1

https://developer.mozilla.org/en-US/docs/CSS/box-sizing

最简单的方法是将输入设置为使用box-sizing: border-box;

input.myClass {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

这适用于大多数浏览器。

于 2012-11-12T08:23:26.040 回答
1

您可以使用以下 CSS 规则将 box-sizing 更改为“border-box”：

* { 
    -moz-box-sizing: border-box; 
    -webkit-box-sizing: border-box; 
    box-sizing: border-box;
}

恕我直言，这会导致更容易理解的行为。例如，“100%”的宽度意味着 100%，包括边框、边距和填充。你可以在这里阅读更多关于它的信息：http: //paulirish.com/2012/box-sizing-border-box-ftw/

另外，作为旁注，请考虑不要使用表格来对齐表单字段。看看我的博客文章：http ://davidtanzer.net/css_vertical_align

于 2012-11-12T08:24:29.890 回答