Question

我有一个登录页面，页面上有几个文本框，其中一个模式设置为“密码”。此页面之前有效，但我们最近注意到（自IE7更新以来）指定为密码文本框的文本框不像页面上的其他文本框那样宽。如果我删除TextMode =“密码”，文本框会调整大小以匹配其他文件。

当使用IE开发人员工具栏显示页面时，我检查了页面上的奇怪现象，但一切看起来还不错。

文本框代码非常基础：

    <tr>
  <td>
    Username
  </td>
  <td>
    <asp:TextBox ID="txtUsername" runat="server" TabIndex="2"></asp:TextBox>
  </td>
</tr>
<tr>
  <td>
    Password
  </td>
  <td>
    <asp:TextBox ID="txtPassword" TextMode="Password" runat="server" TabIndex="3"></asp:TextBox>
  </td>
</tr>

我发现另外一个人在网上询问这个问题并通过将css应用到页面上的所有输入控件来修复它，但我还没有设法让它工作。

Answer 1

确保所有控件大小相同的最佳方法是通过样式（内联或css）。

Answer 2

我发现如果您使用以下CSS：

input, select { font-family: sans-serif; }

这将使文本和密码框的宽度相同。 font-family不必是sans-serif，但必须定义它。

这可能是一个更好的解决方案，因为它似乎可以解决问题，而不是通过在CSS中使用显式宽度来对其进行创可贴。现在，您可以使用通用字体系列来使用浏览器的默认字体设置，或者如果您使用的是用于页面的特定字体，则可以使用explcit。

Answer 3

如果您为文本框提供Width =“”属性，这可能会有所帮助。这应该迫使他们在宽度方面匹配，即使他们有不同的文本模式。

Answer 4

如果为TextBox.Columns属性（映射到＆lt; input size =“”/＆gt;属性）指定值（如20），它们将匹配。如果要使用CSS，则应尽量避免使用内联样式（TextBox.Width属性创建）。

Answer 5

您可以尝试将所有文本框的Width属性设置为相同。 150将是一个很好的价值。

Answer 6

我认为当您将大小指定为“列”时，为密码类型和非密码类型的文本框设置不同的宽度是正常的，因为文本框的宽度是通过乘以最大字符的宽度来计算的。按请求的列数显示字体（例如“m”）。

当密码传递时，最大的角色总是子弹（所有角色都是子弹），因此宽度不同（显然使用比例字体时）。要解决此问题，请以像素而不是列指定宽度，即：style =“width：250px;” （或使用非比例字体）。

Answer 7

我最近遇到了Internet Explorer 11的问题。我在这里尝试了一切，没有任何效果，但随后偶然发现了this帖子。为我解决的是这样做：

<tr>
    <td style="width: 1000px; text-align: right;">User Name:</td>
    <td style="width: 200px; text-align: right;">
        <asp:TextBox ID="UNTextBox" runat="server" style="width: 200px;"></asp:TextBox>
    </td>
</tr>
<tr>
    <td style="width: 1000px; text-align: right">Password:</td>
    <td style="width: 200px; text-align: right;">
        <asp:TextBox ID="PassTextBox" runat="server" TextMode="Password" style="width: 200px;"></asp:TextBox>
    </td>
</tr>

我必须直接将style="width: 200px;"放入asp:TextBox标签，或者IE11中的尺寸不匹配。

希望能帮到某人

TextMode = Password时，ASP.NET文本框大小不同

7 个答案: