表組み風にするには幅を指定して float:left にします - 専門家回答 - 専門家プロファイル

専門家の皆様へ 専門家プロファイルでは、さまざまなジャンルの専門家を募集しています。
出展をご検討の方はお気軽にご請求ください。
井上 みやび子

井上 みやび子
Webエンジニア

- good

表組み風にするには幅を指定して float:left にします

2010/03/03 14:17
(
5.0
)

はじめまして。すぐ使える株式会社の井上と申します。

横3×縦2 などの表示は、横幅を決めた div を float:left で連記することで実現できます。

*CSSで表組みするコードの例
<div style="width: 900px"> ←外枠

<div style="width: 300px; float:left">....</div> ←セル1つに該当
<div style="width: 300px; float:left">....</div>
:(6個分)

</div> ←外枠の終わり

**留意点
上記のように単純にサイズ指定するとセルに該当する<div>の中身やブラウザ、DTDによってはセル2つで折り返しされてしまう場合もありますので、CSS指定は参考書などを見ながら工夫して下さい。


ご参考:表組み風の画像一覧を作る方法
PR---5,250円のCMS「すぐ使えるCGI」

評価・お礼

よっきー さん

うまくできました
ありがとうございました

(現在のポイント:1pt このQ&Aは、役に立った!

この回答の相談

CSSとtableタグについて

法人・ビジネス ホームページ・Web制作 2010/03/03 14:00

Webページのメニューボタンを横3×縦2で配置させたいと考えています。

TABLEタグは使わない方がいいという話をよく聞くので、CSSで配置させようと考えているのですが、左右に分けるのであればfloatタグを… [続きを読む]

よっきーさん (京都府/29歳/男性)

このQ&Aの回答

Floatを使用して作ればいいと思います。 吉村 昭二(ITコンサルタント) 2010/03/03 14:48
CSSなら外部ファイルに 早川 徹(ITコンサルタント) 2010/03/03 20:45

このQ&Aに類似したQ&A

Amebaブログのデザイン変更について tcnさん  2013-10-04 08:51 回答1件
夫が独立した(web会社)妻です。 もっち吉さん  2013-06-23 03:37 回答5件
CSSでの文字指定について tcnさん  2013-04-10 09:24 回答2件