Bootstrap
でフッター内のボタンを中央寄せしたいです。
以下のソースのように、ヘッダー内でcenter-block
を
指定しておりますが、中央寄せ対象のButton
がうまく中央に
表示されません。どなたか、解決方法もしくはヒントになる
コメントを頂ければ幸いです。
よろしくお願い致します。
html
1<!DOCTYPE html> 2<html lang="en"> 3 <head> 4 <meta charset="utf-8"> 5 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 6 <meta name="viewport" content="width=device-width, initial-scale=1"> 7 <title>Sticky Footer Navbar Template for Bootstrap</title> 8 <link href="bootstrap.css" rel="stylesheet"> 9 <link href="sticky-footer-navbar.css" rel="stylesheet"> 10 </head> 11 <body> 12 <footer class="footer"> 13 <div class="container center-block"> 14 <div> 15 <button class="btn btn-primary">ボタン1</button> 16 <button class="btn btn-primary">ボタン2</button> 17 <button class="btn btn-primary">ボタン3</button> 18 </div> 19 </div> 20 </footer> 21 </body> 22</html> 23
css
1/* Sticky footer styles 2-------------------------------------------------- */ 3html { 4 position: relative; 5 min-height: 100%; 6} 7body { 8 /* Margin bottom by footer height */ 9 margin-bottom: 60px; 10} 11.footer { 12 position: absolute; 13 bottom: 0; 14 width: 100%; 15 /* Set the fixed height of the footer here */ 16 height: 60px; 17 background-color: #f5f5f5; 18} 19
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2017/02/08 14:47