質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

Q&A

解決済

1回答

2164閲覧

cssが反映されない

banianizm

総合スコア92

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

CSS

CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

0グッド

0クリップ

投稿2016/11/28 14:36

お世話になります。
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

宜しくお願い致します。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

gin

2016/11/28 14:42

ちゃんと適用されていますよ?
退会済みユーザー

退会済みユーザー

2016/11/28 14:49

cssは先の方が言うようにちゃんと反映されています。href属性で指定しているcssファイルが存在するか確かめてください。もしくは、どのようにうまくいかないのかなどを具体的に追記してください。
banianizm

2016/11/28 14:49

.right_nav { float: right; }が適用されていないと思いますが何かの間違いでしょうか?
gin

2016/11/28 14:51

こちらで確認した限りでは「.right_nav」を指定したdivは右に張り付いているので効いていますね。
退会済みユーザー

退会済みユーザー

2016/11/28 14:52

こちらだと.right_navは反映されていますね。。。
banianizm

2016/11/28 15:04

申し訳ありませんがどのように確認されていますか?もしかしたらcloud9ということで反映されていないのかも知れません。
退会済みユーザー

退会済みユーザー

2016/11/28 15:07

質問文にあるコードをそのままfirefoxで見ました。他の主要ブラウザでも確認済みです。
toutou

2016/11/28 15:09

divが普通のと終了ので9個で奇数じゃない?
dit.

2016/11/28 15:21

インデント的に見ると<div class="content">の1行上の閉じdivが多いように見えます。headerが閉じた後にもうひとつ閉じてますね
guest

回答1

0

ベストアンサー

これまるごとコピーしてみてください。
どうなります??
まるごとコピーです。

css

1* { 2 margin: 1px; 3 padding: 1px; 4} 5li { 6 display: inline-block; 7} 8.left_nav { 9 float: left; 10 color: #00f; 11} 12.right_nav { 13 float: right; 14 color: #f00; 15}

投稿2016/11/28 15:23

gin

総合スコア2722

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

gin

2016/11/28 15:30

では、colorを抜いてください。 私の予想では、.right_nav {}を作った際に全角の記号がどこかに入った。 それをそのままコピーして.left_navも作ったので両方とも効いていなかった。 といったところでしょうか。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問