ASP.NET Размер текстового поля отличается, когда TextMode = Пароль

Question

У меня есть страница входа, на которой есть несколько текстовых полей, одно из которых имеет режим «пароль». Эта страница работала ранее, но мы недавно заметили (после обновления 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 ко всем элементам управления вводом на странице, но мне так и не удалось заставить это работать.

Answer 1

Лучший способ гарантировать, что все ваши элементы управления будут одинакового размера, - это стиль (встроенный или css).

Answer 2

Я обнаружил, что если вы используете следующий CSS:

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

это сделает текстовые поля и поля пароля одинаковой ширины. Семейство шрифтов не обязательно должно быть без засечек, но оно должно быть определено.

Это может быть лучшим решением, так как кажется, что оно решает проблему, а не накладывает на нее боль, используя явную ширину в вашем CSS. Теперь вы можете просто использовать настройки шрифта по умолчанию в браузере, используя общие семейства шрифтов, или быть explcit, если у вас есть определенный шрифт, который вы используете для страницы.

Answer 3

Если вы укажете значение (например, 20) для свойства TextBox.Columns (которое соответствует атрибуту ), они будут совпадать. Если вы хотите использовать CSS, вам следует избегать встроенного стиля (который создает свойство TextBox.Width).

Answer 4

Может помочь, если вы предоставите свойство Width = "" для своих текстовых полей. Это должно заставить их совпадать по ширине, даже если они имеют разные текстовые режимы.

Answer 5

Я недавно столкнулся с этой проблемой с Internet Explorer 11. Я попробовал все здесь, и ничего не получалось, но потом наткнулся на этот пост. Что решило это для меня, так это:

<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 не совпадут.

Надеюсь, что кому-то поможет

Answer 6

Я думаю, это нормально иметь разную ширину для текстовых полей с паролем и без пароля, когда вы задаете размер в виде «столбцов», так как ширина текстового поля рассчитывается путем умножения ширины наибольшего символа в шрифт (скажем, «m») по запрошенному количеству столбцов.

При передаче паролем самый большой символ всегда является маркером (все символы являются маркерами), поэтому ширина отличается (очевидно, при использовании пропорционального шрифта). Чтобы решить эту проблему, укажите ширину в пикселях, а не в столбцах, т. Е. Style = "width: 250px;" (или используйте непропорциональный шрифт).

Answer 7

Вы можете попробовать установить свойство Width всех текстовых полей одинаковым. 150 будет хорошим значением.