html
1<!DOCTYPE html> 2<html> 3 <head> 4 <meta charset="utf-8"> 5 <link rel="stylesheet" type="text/css" href="hogehoge.css"> 6 <title></title> 7 </head> 8 <body> 9 <div id="wrapper"> 10 <h1>hogehoge</h1> 11 <form action="" method="post"> 12 text 13 <input type="text" name="name" id="name" value=""> 14 text 15 <input type="text" name="ruby" id="ruby" value=""> 16 text 17 <input type="text" name="address1" value=""> 18 text 19 <input type="text" name="address2" value=""> 20 text 21 <input type="text" name="address3" value=""> 22 text 23 <input type="text" name="address3" value=""> 24 text 25 <input type="email" name="mail" value=""> 26 text 27 <input type="email" name="mail2" value=""> 28 text 29 <textarea name="inquiry"> 30 </textarea> 31 <input id="submit_button" type="submit" name="submit" value="text"> 32 </form> 33 <footer> 34 <span>Copyright hogehoge</span> 35 </footer> 36 </body> 37</html>
css
1@charset "UTF-8"; 2 3body{ 4} 5 6#wrapper{ 7 max-width: 1000px; 8 margin: 0 auto; 9 padding: 0; 10} 11 12#wrapper h1{ 13 text-align: center; 14 padding: 20px; 15} 16 17form{ 18 max-width: 290px; 19 margin: 0 auto; 20} 21 22 23input{ 24 width: 260px; 25 border-radius: 10px; 26 padding: 10px; 27 margin-bottom: 5px; 28} 29 30select{ 31 width: 282px; 32 border-radius: 10px; 33 padding: 10px; 34 margin-bottom: 5px; 35} 36 37textarea{ 38 width: 279px; 39 height: 100px; 40 border-radius: 10px; 41} 42 43input#submit_button{ 44 width: 40%; 45 margin: 10px; 46 text-align: center; 47} 48 49footer{ 50 height: 15px; 51 text-align: center; 52 font-size: 0.6em; 53 padding: 4% 0; 54}
上記の画像の一番下のピンク丸囲みsubmitボタンを中央寄せしたいのですが、できずに困っています。
inputはインライン要素ということでtext-align: center;で中央寄せしましたが反映できません。
cssは不慣れでid名のつけ方や使い方がうまくいかないだけかもしれませんが、
アドバイスいただけないでしょうか。
ブラウザ;firefox
PC;win7 home
回答3件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2016/10/13 02:46