お世話になります。
cssの記述が間違っているのか、それとも何か他が原因か分かりませんがcssが反映されません。考えられる原因を教えてください。
html
1<!DOCTYPE html> 2<html> 3<head> 4 <meta charset="UTF-8"> 5 <title>Insta9</title> 6 <link rel="stylesheet" href="stylesheet.css"> 7</head> 8 <body> 9 <div class="header"> 10 <div class="left_nav"> 11 <h1>insta9</h1> 12 <form> 13 <input type="text" /> 14 <input type="submit" /> 15 </form> 16 </div> 17 <div class="right_nav"> 18 <ul> 19 <li>投稿</li> 20 <li>ログイン</li> 21 <li>サインアップ</li> 22 </ul> 23 </div> 24 </div> 25 </div> 26 <div class="content"> 27 <p>ログイン</p> 28 <p>パスワード</p> 29 <p>ログイン</p> 30 </div> 31</body> 32</html>
css
1* { 2 margin: 1px; 3 padding: 1px; 4} 5 6li { 7 display: inline-block; 8} 9 10 11.right_nav { 12 float: right; 13} 14 15.left_nav { 16 float: left; 17} 18
宜しくお願い致します。
ちゃんと適用されていますよ?
cssは先の方が言うようにちゃんと反映されています。href属性で指定しているcssファイルが存在するか確かめてください。もしくは、どのようにうまくいかないのかなどを具体的に追記してください。
.right_nav { float: right; }が適用されていないと思いますが何かの間違いでしょうか?
こちらで確認した限りでは「.right_nav」を指定したdivは右に張り付いているので効いていますね。
こちらだと.right_navは反映されていますね。。。
申し訳ありませんがどのように確認されていますか?もしかしたらcloud9ということで反映されていないのかも知れません。
質問文にあるコードをそのままfirefoxで見ました。他の主要ブラウザでも確認済みです。
divが普通のと終了ので9個で奇数じゃない?
こんな感じですね。https://jsfiddle.net/sp15q126/
本当ですね。私の場合だとこうなります。https://gyazo.com/df88c9a844f3b3e17679a02b47f4a586
インデント的に見ると<div class="content">の1行上の閉じdivが多いように見えます。headerが閉じた後にもうひとつ閉じてますね
回答1件
あなたの回答
tips
プレビュー