【发布时间】：2011-01-03 21:22:21
【问题描述】：
我正在尝试设置登录 Web 控件的外观，但我遇到了很多问题。据我所知，我已经正确设置了所有内容，但由于某种原因，控件仍然无法正确显示：
a) 两个 TextBox 控件（ID 为 UserName 和 Password ）的宽度应等于表格宽度的 70%，但实际上并非如此虽然我已经设置了它们的宽度属性。知道这是为什么吗？
b) 如果包含 lblPassword 和 lblPassword 控件的表格单元格的 text-align 属性设置为 center，则 lblPassword 和 lblPassword 溢出。这是为什么呢？
<div id="loginbox">
<asp:Login ID="Login1" runat="server" Width="100%" FailureAction="RedirectToLoginPage"
RememberMeSet="false">
<LayoutTemplate>
<table>
<tr>
<td style="padding:6px;text-align:center;">
<asp:Label ID="lblUserName" Width="30%" runat="server" Text="UserName "></asp:Label>
</td>
<td>
<asp:TextBox ID="UserName" Width="70%" runat="server"></asp:TextBox>
</td>
</tr>
<tr>
<td style="padding:6px;text-align:center;" >
<asp:Label ID="lblPassword" Width="30%" runat="server" Text="Password "></asp:Label>
</td>
<td>
<asp:TextBox ID="Password" Width="70%" runat="server"></asp:TextBox>
</td>
</tr>
</table>
</LayoutTemplate>
</asp:Login>
#loginbox
{
position: absolute;
top: 16px;
right: 30px;
width: 180px;
height: 80px;
padding: 2px 2px 2px 2px;
font-size: 9px;
margin:0px;
}
非常感谢
编辑：
这段代码告诉浏览器跨度应该比 TD 小 70%。告诉 TD 它应该是什么宽度的唯一元素是跨度，该跨度希望比 TD 小 70%。所以 TD 最终只是使用跨度内的文本来判断它应该有多大。
然后，这与我的文本框示例不同，因为据我了解您的论点，在上述情况下，跨度元素（即跨度内的文本）使用其默认宽度呈现，而 TD 将其宽度调整为比 span 的默认宽度大 70%？！ 但是在 TextBox 控件的情况下，用于 TextBoxes 控件的宽度不是它们的默认宽度 D，而是它们的宽度也减小了（我们称之为减小的 TextBox 的宽度 W），因此 TD 并不比 D 大 70%，而是相反，TD 比 W 大 70%（其中 W
现在右侧的 TD 想要是行 (TR) 宽度的 70%，这与 TABLE 的宽度相同。在这种情况下，左侧的 TD 决定了表格的结束大小，因为它的内容应该占表格宽度的 30%。
为什么说左边的元素决定了表格的大小呢？左右 TD 不是都决定了表格的最终大小吗？
感谢队友
第二次编辑：
a) 我知道这两个单元格应该有相对于彼此的大小，但我不确定我是否理解 55px / 30% * 70% 如何给我们正确的结果？如果有的话，公式不应该是 55 * 100% / 30% （这里 55px 代表右侧单元格宽度的 30%）或 55 * 100% / 70% （这里 55px 代表左侧单元格宽度的 70%）？！
b) 如果这两个单元格中的 span 元素的宽度不相等怎么办？那么浏览器将如何计算两个单元格的宽度？
c) 我假设如果 table 指定了宽度，那么两个单元格的宽度将不是相对于彼此，而是相对于 table 的宽度？
感谢队友
第三次编辑：
A) 据我了解您的解释，浏览器按以下方式计算两个单元格的宽度：
左侧单元格的宽度设置为某个值的 30%，公式 55px * 100% / 30% = 183px* 告诉我们左侧单元格的宽度（即 55px）是 183px 的 30%。
这也意味着右侧单元格的宽度等于 183px 的 70%，即 183 * 70% / 100% = 124px。因此左右列的宽度分别为 183px 的 30% 和 183px 的 70%。
B）但我认为您在解释中使用的术语->“左右单元格的宽度应该彼此相对”
a) 左侧单元格的宽度应为右侧单元格宽度的 30%。由于左侧单元格的宽度为 55px，其中 55px 代表右侧单元格宽度的 30%，因此右侧单元格的宽度为 55px * 100% / 30% = 183 px
OR
b) 右侧单元格的宽度应为左侧单元格宽度的 70%。由于右侧单元格的宽度为 55px，其中 55px 代表左侧单元格宽度的 70%，因此左侧单元格的宽度为 55px * 100% / 70% = 78px
【问题讨论】：
标签： asp.net css xhtml webforms