Q&A
前提・実現したいこと・問題
ホームページでボタンを作っているのですが
ほーむぺーじ
ボタンの幅が文字の幅ぴったりになってしまいます
この文字との間に余白を作るのにはどうしたらいいですか？
該当のソースコード
css
1.btn{ 2 display: inline; 3 height: 100px; 4 width: 200%; 5 color: #fff; 6 text-decoration: none; 7 text-align: center; 8 line-height:50px; 9 background-color: #4f4; 10 border-radius: 4px; 11 transition: all 400ms; 12 border-bottom: 5px solid #888; 13 position:relative; 14 top: 0px; 15 16} 17.btn:hover{ 18 background-color: #8f8; 19 color:#555; 20} 21.btn:active{ 22 border-bottom: 0px solid #888; 23 position:relative; 24 top: 5px; 25 transition: all 100ms; 26}
試したこと
width: 200%;を追加
回答1件
0
とりあえず以下を試すことを提案します。
display: inline-block;にする。
widthとheightとline-heightの設定は一旦やめる。（必要ならあとで設定してください）
テキストの周りの余白はpaddingで設定する。
投稿2021/08/16 14:43
総合スコア8402
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2021/08/16 22:39