Bootstrapのグリッドシステムではそれぞれ行を12分割して管理しますが、例えば、特定の行だけを微調整したい場合はどのようにすればよいのでしょうか。
<section> <div class="container"> <div class="row"> <div class="col-lg-10 col-lg-offset-1"> <div class="col-lg-2">項目名1</div> <div class="col-lg-10">内容1</div> </div> </div> <div class="row"> <div class="col-lg-10 col-lg-offset-1"> <div class="col-lg-2">項目名1</div> <div class="col-lg-10">内容1</div> </div> </div> <div class="row"> <div class="col-lg-10 col-lg-offset-1"> <div class="col-lg-2">項目名2</div> <div class="col-lg-10">内容2</div> </div> </div> </div> </section>
このようにすると、項目名が短い場合、内容との間に無駄なスペースができてしまいます。
かと言って、ネガティブなマージンなどで指定するとスマホなどで見た場合の表示が崩れてしまいます。
項目名がそもそも2文字や3文字といった明らかに少ない字数でグリッドの分割された横幅ですと適当な幅とならないような場合で、且つ、他の箇所への影響(グリッドの設定自体を弄らない/他の要素は現状の設定で問題がない為)を及ぼさないような変更はどのようにすればよいのでしょうか?
回答1件
あなたの回答
tips
プレビュー