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

Posted 2023-02-24

【中文标题】当 TextMode=Password 时 ASP.NET 文本框大小不同

【英文标题】：ASP.NET Textbox size differs when TextMode=Password

【发布时间】：2009-01-21 17:33:28

【问题描述】：

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

使用 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 来修复它，但我也没有设法让它工作。

【参考方案1】：

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

【讨论】：

以下 css 有效（我必须将其应用于所有文本框，而不仅仅是密码模式的文本框） .TextBox font-family: Arial, Tahoma, Verdana, Calibri;字体大小：12px；颜色：黑色;高度：自动；宽度：自动；

【参考方案2】：

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

input, select  font-family: sans-serif; 

这将使文本框和密码框的宽度相同。 font-family 不必是无衬线字体，但必须定义。

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

【参考方案3】：

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

【参考方案4】：

如果您为 TextBox.Columns 属性（映射到 属性）指定一个值（如 20），它们将匹配。如果你想使用 CSS，你应该尽量避免使用内联样式（由 TextBox.Width 属性创建）。

【参考方案5】：

您可以尝试将所有文​​本框的 Width 属性设置为相同。 150 会很划算。

【参考方案6】：

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

输入密码时，最大的字符总是项目符号（所有字符都是项目符号），因此宽度不同（显然使用比例字体时）。要解决此问题，请指定以像素为单位的宽度，而不是列，即：style="width:250px;" （或使用不成比例的字体）。

【参考方案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 中将不匹配。

希望对某人有所帮助