ID非公開

2021/1/15 17:31

22回答

横並びのテーブルセルのような枠組みの作り方で、レスポンシブに崩せるフレームでお勧めのやり方って何でしょうか。

HTML、CSS | JavaScript39閲覧xmlns="http://www.w3.org/2000/svg">250

ベストアンサー

1

1人がナイス!しています

ID非公開

質問者

2021/1/15 19:07

>(float:leftより)普通にインライン要素の方が良いです。 最初の方のレスにサンプルソースを追記させていただきましたが、単純に、考え方としては合っている感じですかね。。 インライン要素でも、高さ関連に不安要素があった気がするのと、サンプルのような崩れ方にも不安がないのであれば色々テストしてみたいと思うのですが。

その他の回答(1件)

0

具体的なソースコードがないとなんとも言えませんが、フレックスボックスやグリッドレイアウトを使うと楽だと思いますよ。 https://www.webcreatorbox.com/tech/css-flexbox-cheat-sheet https://qiita.com/kura07/items/e633b35e33e43240d363

ID非公開

質問者

2021/1/15 19:04

基本的な構造としては以下のようなフレームです。 画面幅に合わせてブレイクするので便利なんですが、枠の高さが可変する事が前提なので、JSでの高さ補正が必要です。 おかげで色々と弊害も発生して、採用しているフレームの変更を検討しています。 <meta name="viewport" content="width=device-width, initial-scale=1"> <div style="a"></div> <div style="a"></div> <div style="a"></div> .a { float:left; width:50%; } @media only screen and (max-width:767px) { .a { float:left; width:100%; } }