点線を可変にして文字の大きさはそのまま、点線だけが伸縮してレスポンシブ。点線を可変にして文字の大きさはそのまま、点線だけが伸縮してレスポンシブ。PC版タブレット版スマホ版スマホ版では点線を取っ払って上下にテーブル的に見せる、でもいいかもしれません。class="tab-reader-box3">500円</span></li></ul>リスト表記にしたかったのでli要素の中をflexで横並びにしていきます。auto;}解説ポイントはflexプロパティで、フレックスアイテムをフレックスコンテナーの領域に収めるために、どのように伸長・収縮させるかを指定します。flexプロパティは一括指定プロパティです。分割すると以下のような指定値になります。初期のサイズは他のフレックスアイテムに応じるよ!」という指定にしているんですね。border-box;をしていても、いずれにせよ線はきれいにセンター揃いになりません。2pxで指定しても、1px上にあげることでセンタリングしています。noneで一度打ち消しています。hrのリセットって忘れがちなんですよね......。結果こんなふうになりました。レスポンシブでテーブルのようにしたい場合は、以下のCSSを上記に付け加えます。#CCC;}}今のところこれが一番効率よくレスポンシブしてくれるような気がします。他にやり方があったら追記していきます。この記事であなたの課題を解決することができましたか?疑問点があったり、解決できなかったことがありましたら、お気軽にご相談してください。最新の記事インクループ株式会社インクループ株式会社は、データ分析、市場調査に基づく企画立案、コンテンツ制作、運用を通じてお客様の目標を実現する会社です。WEBサイトをもっと活用したい、ECサイトの売上をもっと増やしたいなどのお悩みをお持ちの方はぜひお気軽にお問い合わせください。Animateを利用したアニメーションを作ってみる。超初心者なのでプログラミング学習のProgeteをやってみました。Effectsでシンプルな炎のエフェクトを作成するチュートリアルコメントは利用できません。Animateを利用したアニメーションを作ってみる。超初心者なのでプログラミング学習のProgeteをやってみました。ホームページ制作、WEBマーケティングページ上部へ戻る。