IE7対応のレスポンシブなtableもどき

jQueryはメディアクエリをIE7とIE8に適用させるために「css3-mediaqueries.js」と、子要素の高さを揃える「heightLine.js」を使用。

要素内の文章量が増えると破綻する。横に並ぶliの個数と内包する要素の文字数によってはなんとか使えるという程度。

tableサンプル 3

  1. 見出し
    内容
  2. no.1
    data1
  3. no.2
    data2
  4. no.3
    data3
  5. no.4
    data4
  6. no.5
    data5
  7. no.6
    data6
  8. no.7
    data7
  9. no.8
    data8
  10. no.9
    data9
  11. no.10
    data10

tableサンプル 4

  1. 出演順序
    出演動物名
    出演日時
  2. no.1
    Rat
    1914年
  3. no.2
    Ox
    1915年
  4. no.3
    Tiger
    1916年
  5. no.4
    Hare
    1917年
  6. no.5
    Dragon
    1918年
  7. no.6
    Sprent
    1919年