###前提・実現したいこと
HTMLに書いたタイトルが移動しません。
トップページの文字を、cssのheaderで指定している高さのちょうど真ん中(=50pxということでしょうか?)に位置させたいです。
###発生している問題・エラーメッセージ
Googleの開発者ツールを使っていますが、エラーは発生していません。
###該当のソースコード
HTML
1<html lang="ja"> 2 <head> 3 <meta charset="utf-8"> 4 <link rel="stylesheet" href="top.css"> 5 </head> 6 <body> 7 8 <header class="clearfix"> 9 <div id="top"> 10 <div> 11 <h1 class="title">トップページ</h1> 12 </div> 13 <div class="right-position"> 14 <h3 class="login">ログイン</h3> 15 16 <form class="form-inline" action="{% url 'accounts:detail' %}" method="post" role="form"> 17 <div class="form-group"> 18 <label class="username_form">ユーザーネーム</label> 19 <input id="id_username" name="username" type="text" value="" minlength="5" maxlength="12" placeholder="ユーザーネーム" class="form-control"/> 20 </div> 21 <div class="form-group"> 22 <label class="password_form">パスワード</label> 23 <input id="id_password" name="password" type="password" value="" minlength="8" maxlength="12" placeholder="パスワード" class="form-control"/> 24 </div> 25 26 <div> 27 <button type="submit" class="btn btn-primary btn-lg" style="color:white;background-color: #F62459;border-style: none;">ログイン</button> 28 <input name="next" type="hidden"/> 29 </div> 30 </form> 31 </div> 32 33 </div> 34 </header> 35 36 </body> 37</html>
CSS
1body{ 2 color: black; 3 background-size:cover; 4 background-repeat:no-repeat; 5 background-position: center center; 6 } 7*{ 8 margin: 0; 9 padding: 0; 10} 11 12header{ 13 height: 100px; 14 background-color: black; 15} 16 17.title{ 18 float:left; 19 color:white; 20 font-size: 70px; 21 22} 23 24.float-left{ 25 float: left; 26} 27 28.right-position{ 29 width: 50%; 30}
###試したこと
CSS
1.title{ 2 float:left; 3 color:white; 4 font-size: 70px; 5 6}
の部分にpadding-top:-10px; や margin-top: 10px;など書きましたが全く動きませんでした。pxの値を極端な値にしても動きませんでした。
回答3件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。