inputタグのsize属性

HTML

inputタグのsize属性

 状態:不明  閲覧数:3,993  投稿日:2012-02-01  更新日:2012-02-01
あるサイトで、レイアウト崩れに遭遇。
調べてみたら、原因は、「inputタグのsize属性」だったのでメモ
  
より正確には、
というか、直接のきっかけは、
font-size:100%;とかしたこと。

これまで、気にしたことなかったけど、
普通に、size='16'とかすると、
font-family、font-size指定の影響を受けるのね。
「sizeの値は文字数 → 入力欄の幅を文字数で指定」

FF9.0.1で見たら、テーブルwidth指定してるのに、突き破ったりしてるし…。

ちなみに、bootstrapてどうやってるんだろう?
と思ってみたら、フツーにピクセル指定してるだけだった。
やっぱそーなのか…
▼bootstrap.min.css (140 行目)
input.span3, textarea.span3, select.span3 {
  display: inline-block;
  float: none;
  margin-left: 0;
  width: 150px;
}


絶対パス

一つの要素に対して「id 属性値」を複数指定することは出来ない



週間人気ページランキング / 10-21 → 10-27
順位 ページタイトル抜粋 アクセス数
1 Design 0 14
2 鉄道会社毎のカラーコード | カラーコード(色) 5
3 カラーコード / 色コード | カラーコード(色) 4
4 「bgcolor」「background-color」「background」の違い | CSS 3
5 RGBの種類 / ビットカラー | RGB(色) 2
5 「レイアウト崩れ」がどうしても解決しない → Chrome「デベロッパーツール」で怪しいと思った要素を、正常表示されるまで削除し続けていく | CSSトラブル対応(CSS) 2
5 Flickrがサポートするライセンス 9 + 特別なライセンス 2 | 画像著作権(画像) 2
5 「マウスオーバー」「ロールオーバー」「ホバー」の違い | CSS 2
5 HSLとHSVの違い | 色変換(色) 2
5 縦横比が16:9となる整数値の組み合わせ 2
5 「Midjourney」を使用してみた感想。2022 年 8 月 2 時点では、画像生成能力自体は素晴らしいと思いますが、UIが致命的に分かりづらかったです。 | AI画像生成 2
5 Chromeブックマーク ショートカット | Chromeブックマーク(ブラウザ) 2
6 ボタン候補2 / 「ボタン」エリア外で「テキスト」表示しても良いの? | ボタン(UI) 1
6 Click&Clean | Chrome 拡張機能 1
6 問題発生 / 対応 1
6 Illustrator CS2 でファイル名に「更新済み」を追加しない | Illustrator CS2(Illustrator) 1
6 position(CSS) カテゴリー 1
6 パッケージ化されてない拡張機能 | Chrome 拡張機能 1
6 キャラクター無料作成ジェネレーター / FLASH / オンラインサービス | イラスト参考(デザイン) 1
6 「CSSプロパティ」書く順番 | コーディングルール 1
2026/10/28 5:05 更新