Q&A
前提・実現したいこと
boostrapでボタンをpaddingで位置調整したい
発生している問題・エラーメッセージ
bootstrapを使ってボタンをpaddingを使って右寄りに調整したいのですが、やり方が分かりません。別にCSSファイルを作って書くしかないのでしょうか？今はtext-rightで移動させていますが、空白を作る等細かい調整ができなくて困ってます。
エラーメッセージ
該当のソースコード
ソースコード<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>Bootstrapの練習</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="css/bootstrap.css"> <script type="text/javascript" src="js/jquery-3.5.0.min.js"></script> <script type="text/javascript" src="js/bootstrap.js"></script> </head> <body> <h1></h1> <button type="button" class="btn btn-default">概要</button> <button type="button" class="btn btn-default">準備</button> <button type="button" class="btn btn-default">安全</button> <button type="button" class="btn btn-default">マネープラン</button> <div class="text-right"> <button type="submit" class="btn btn-danger">はじめる</button> </div> </body> </html>
回答1件
0
ベストアンサー
「はじめる」ボタンが現状は右端にピッタリと張り付いてますが、余白を付けたいということでしょうか。
空白ユーティリティでマージンかパディングを設定すればいいでしょう。
空白ユーティリティ～Bootstrap4移行ガイド
ボタンに右マージンを付加
html
1<div class="text-right"> 2<button type="submit" class="btn btn-danger mr-2">はじめる</button> 3</div>
親要素にパディングを付加
html
1<div class="text-right pr-2"> 2<button type="submit" class="btn btn-danger">はじめる</button> 3</div>
投稿2020/04/29 02:03
総合スコア33782
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2020/04/29 09:17