単一のフォーム内で多数の入力ボックスと選択ボックスを揃えようとしています。さまざまな css スタイルを試してみましたが、すべて失敗したようです (??)。
私のhtmlはここにあります。
http://jsfiddle.net/felix001/kA8cd/3/
これらの要素を整列させるための簡単な方法を知っている人はいますか?
ありがとう、
4 に答える
0
これらの要素を整列させるための簡単な方法を知っている人はいますか?
はい、Twitter Bootstrap を使用できます: http://twitter.github.com/bootstrap/
これは、一般的な HTML 要素 (フォームを含む) に優れた、適切に記述されたスタイルを提供します。それらを出発点として使用し、そこから拡張します。
于 2012-06-25T21:38:55.427 に答える
0
ラベルを左に、入力を右に揃えたい場合は、次のようにします。
ラベル { クリア: 両方; フロート: 左; 最小高さ: 35px; } 入力、選択 { float: right; } </p>
これは最善の解決策ではありませんが、簡単で迅速かつシンプルなものを探しているなら、うまくいくはずです。すべてを div でラップし、そのラッパーに幅を設定して、フィールドとラベルが互いに近くなるようにすることもできます。
于 2012-06-25T22:23:07.180 に答える
0
以前は、表形式以外のデータをレイアウトするためにテーブルを使用しないように言われていましたが、この場合、簡単なソリューションが必要な場合は、それでうまくいきます。（レイアウトにテーブルを使用することを容認しているわけではありません。それがオプションであることをそこに置くだけで、他のすべてが失敗するはずです。）
于 2012-06-25T21:42:38.727 に答える
0
リストを使用してフォームを並べるのが好きです。この方法がまだ広く採用されているかどうかはわかりませんが、かなり役に立ちました。リストを使用してフォームをレイアウトする方法の例を示すために、フィドルをいじりましたが、例のスタイルを完全には設定しませんでした:)
別のリストの例http://woork.blogspot.com/2008/06/form-elements-design-using-css-and-list.html
リストを使用すると、ナイス チャンクを操作できます。@Roddy が言ったように、テーブルは機能しますが、より良いオプションは、 のようなプロパティを持つテーブルのように div をレイアウトすることdisplay: table-cellです。
この男のようなフロートを使用することもできます http://www.dailycoding.com/Posts/layout_form_without_tables_with_css_trick.aspx
これらの方法はすべてかなり適切に機能すると思います。より具体的な回答が必要な場合は、フォームをどのように配置するかについて詳細をお知らせください。
于 2012-06-25T22:24:26.367 に答える