« 認証サービスいろいろ | メイン | ハードディスク単価 30円/G »

css,javascript: グリッドデータの操作

あとで読む

javascript でグリッド的なデータを動的に書き換える操作を実現する場合に候補として

  1. table で実現
  2. inline-block で実現
  3. float:left で実現

の3通りを考えてみた。セルの幅を固定する必要があるため、widthの効かないインライン要素は使えない。

tableはレイアウトが崩れにくくてよいのだが、検索エンジンにはあまり好かれないのと、IE では書き換えで問題が起こったり(tbodayがないと動かない by 「オレがルールだ!」:IE6でtable要素のappendChild、とか、trのinnerHTML書き換えるとレイアウト崩れるとか。→再現性微妙。微妙なところがまたイヤ)するので、とりあえず保留。

次に、inline-block だが、これはまず、Firefoxでは未実装と考えてよい。-moz-inline-boxで一応動作するが、text-alignが効かないなど、問題アリアリ(参考 Bug Report: display:-moz-inline-box + text-align = bug)。IEの場合は、hasLayout なるわけのわからないプロパティを認識してやれば、効くが解説読んでもよくわからない(参考 IE/Win: inline-block and hasLayout

で、最後に float: left だが、ブロックの高さがずれるとレイアウトが崩れやすいので、その辺注意深く制御が必要だが、一番素直に言うことを聞いてくれる気がする。

Trackbacks

Trackback URL:
http://groundwalker.com/mt/gwtb.cgi/239

« 認証サービスいろいろ | メイン | ハードディスク単価 30円/G »

スポンサー

関連ブログ

あわせて読みたい

関連キーワード

Powered by
Movable Type 3.34

連絡先