Jak uzyskać równą szerokość danych wejściowych i wybrać pola?

W formularzu mam jedno pole wyboru i dwa pola wprowadzania. Te elementy są wyrównane w pionie. Niestety nie mogę uzyskać równej szerokości tych elementów.

<select name="name1" style="width:198px">
  <option>value1</option>
  <option>value2</option>
</select><br/>
<input type="text" name="id1" style="width:193px"><br/>
<input type="text" name="id2" style="width:193px">

W powyższym przykładzie najlepsza szerokość dla wybranego elementu wynosi 198 lub 199 pikseli (oczywiście próbowałem 193 pikseli, ale różnica jest znacząca). Myślę, że zależy to od rozdzielczości na różnych komputerach i przeglądarkach, ponieważ te elementy nie mają równych szerokości (czasami myślę, że różnica wynosi około 1 lub 2 px). Próbowałem ustawić te elementy w wierszach div lub tabeli, ale to nie pomaga. Jak mogę uzyskać dokładnie taką samą szerokość tych elementów?

1 odpowiedź

Oto jak zmienić model pola używany przez elementy input / textarea / select, aby wszystkie zachowywały się w ten sam sposób. Musisz użyć właściwości zmiany rozmiaru box, która jest implementowana z prefiksem dla każdej przeglądarki

-ms-box-sizing:content-box;
-moz-box-sizing:content-box;
-webkit-box-sizing:content-box; 
box-sizing:content-box;

Oznacza to, że wspomniana wcześniej różnica 2px nie istnieje.

Twoja odpowiedź

Zaloguj się aby odpowiedzieć.

Operiada

Operiada to polskojęzyczne forum informatyczne działające na zasadzie pytań i odpowiedzi.

Obserwowane tagi

Zaloguj się aby obserwować tagi.