人力検索はてな
モバイル版を表示しています。PC版はこちら
i-mobile

tableの機能を他のタグでcssで表現する方法を教えてください。
※table-cellは無しでお願いします。

単純な横並びではなく、左右で縦幅が同期するようにお願いします。



●質問者: makocan
●カテゴリ:ウェブ制作
○ 状態 :終了
└ 回答数 : 2/2件

▽最新の回答へ

1 ● pogpi
●0ポイント

div、ol、liでできると思います。olはfloat:bottom、liはfloat:leftですね。


makocanさんのコメント
それは単純に横並びかと思います。 今回の質問は、「単純な横並びではなく、左右で縦幅が同期するようにお願いします」が重要になりますが、それも該当記述のみで対応可能なのでしょうか?

pogpiさんのコメント
heightを指定しなければ、liタグの縦幅が一番大きいのに合わせて、揃うと思います。

makocanさんのコメント
これは、floatで左右に並べ、左側をbr などで2行にしたとしたら、右側も自動的に2行文の広さになるということでしょうか? talbe-cellならば可能ですが、少なくとも、私の環境では、floatだけでは実現できませんでしたので。

pogpiさんのコメント
liタグの広さ(height)を同じにするのは多分無理です。

makocanさんのコメント
うーん。やっぱり、CSSでは無理ですかね。 やはり、JSで処理するしかなさそうですかね。

2 ● ジント兄さん
●200ポイント

display:box;


makocanさんのコメント
うーん。出来れば、昔のブラウザも対応できる形式が。。。

ジント兄さんさんのコメント
要素2重でこんな感じで 内側の要素 { padding-bottom: 10000px; margin-bottom: -10000px; float: left; width: 200px; } 外側の要素 { overflow: hidden; }

makocanさんのコメント
ありがとうございます! これ、どこかでも見たのですが、確かに自動で縦幅伸びますね。 どこかに欠点があってやめた気がしましたが 試してみます。
関連質問

●質問をもっと探す●



0.人力検索はてなトップ
8.このページを友達に紹介
9.このページの先頭へ
対応機種一覧
お問い合わせ
ヘルプ/お知らせ
ログイン
無料ユーザー登録
はてなトップ