細長く表示されてしまい見にくいので
横幅をもっと広くしたいのですが
上手く行きません。
試したこと
widthやheightで試しました
HTML
1<div class="contents"> 2 <ul> 3 <li><img src="img/ico_top01.png" alt="コンテンツ1"> 4 <a >格安スマホ・格安SIMのLINEモバイル</a> 5 <button type="button" class="btn btn-outline-info">特徴を見る</button> 6 </li> 7 8 <li><img src="img/ico_top02.png" alt="コンテンツ2"> 9 <a >シンプルな料金プラン</a> 10 <button type="button" class="btn btn-outline-info">プランを見る</button> 11 </li> 12 13 <li><img src="img/ico_top03.png" alt="コンテンツ3"> 14 <a >豊富な端末ラインアップ</a> 15 <button type="button" class="btn btn-outline-info">端末を見る</button> 16 </li> 17 </ul> 18 </div>
CSS
1 2ul { 3 4 overflow: hidden; 5 letter-spacing: -.5em; 6 text-align: center; 7} 8li { 9 display: inline-block; 10 width: 20%; 11 vertical-align: middle; 12 letter-spacing: 0; 13 text-align: center; 14} 15 16li a { 17 font-size: 30px; 18 margin: -4em 0; 19 padding:5em 1em ; 20 background: white; 21 display :block; 22} 23li a:hover { 24 background: white; 25}
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2020/01/15 09:54
2020/01/15 09:55
2020/01/15 09:57