ペタやアクセス解析を見てニヤニヤしているぜろあいです
見てくれている人がいるとわかると嬉しくなってしまうものですね(・ω・)/
さて、今回も前回に引き続きHTMLネタです。
今回紹介したいのは、サイズ指定なし、ブラウザを縮小した際にレイアウトが崩れない
横並びレイアウトの紹介です。
まずは失敗例から。
■position:absolute
これはサイズ指定しないと上手くいかないのでダメですね
■display:inline
これはtable要素に対しては反映されないようですね
（私指定の仕方が悪かっただけ？）
■float:left
要素に固定の幅（px,%共に）が指定できないため、レイアウトが崩れ縦一列になってしまいます。
■box-orient（css3）
これはIEが非対応のようなので×です。
■ul,liで横向き箇条書き
これも結局float:leftを使用するため、縮小した際に縦一列になってしまいます
上記5つの方法は条件に沿わないようです(^_^;)
そんな時に使用したいのがdisplayプロパティのtableとtable-cellです。
これを使用するとHTML上でtableタグを使用するよりも
ソース量を減らす事ができ、レイアウトが崩れることもありません。
IE,firefox,safariでもレイアウトが崩れることはありませんでした。
レイアウトにお困りの方は是非使ってみてください(^ε^)♪
今回はこの辺りで(・∀・)ﾉｼ