意図しない場所に作ったはずのない要素があり、それを消したいです。青い部分です。コードのどこでこれが生まれているのかを見つけられませんでした。お願いします。

html
1<!DOCTYPE html>
2<html>
3	<head>
4		<meta charset="utf-8">
5		<title>山岳環境研究室</title>
6		<link rel="stylesheet" href="common.css">
7	</head>
8	<body>
9		<header>
10			<div class="header-left">
11				<img src="image/S__9576515.jpg" alt="山岳環境研究室" class="header-logo"> 
12				<h1>山岳環境研究室</h1>
13			</div>                                                                   
14		</header><!-- /header -->
15		<div class="top"></div>		
16		<div class="navi">
17			<div class="menu home">
18				<a href="index.html">ホーム</a>
19			</div>
20			<div class="menu research">
21				<a href="research.html">研究</a>		
22			</div>
23			<div class="menu gallery">
24				<a href="gallery.html">ギャラリー</a>
25			</div>
26			<div class="menu media">
27				<a href="media.html">メディア</a>	
28			</div>
29			<div class="menu access">
30				<a href="access.html">アクセス</a>
31			</div>
32		</div>
33		<div class="main">
34			<div class="container">
35				<div class="description">
36					<p>当研究室では、</p>
37					<p>天山山脈,ヒマラヤ,日本アルプスなどのアジア山岳地域を対象に、フィールドワーク（現地調査・観測），GIS（地理情報システム），リモートセンシング（衛星画像解析）の手法を用いて，山岳氷河の変動，山岳永久凍土の空間分布と存在環境，氷河湖決壊洪水や地形災害のプロセスとその被害に関する山岳環境変動の実態解明をめざして活動しています。</p>			
38				</div>
39				<div class="menu pic">
40					
41				</div>
42			</div>
43		</div>
44		<footer>
45			<p>&copy;　山岳環境研究室　All Rights Reserved.</p>
46		</footer>
47	</body>
48</html>

css
1@charset "utf-8";
2*{
3    margin:0;
4    padding:0;
5}
6body{
7    width:960px;
8    margin:0 auto;
9}
10header{
11    height:90px;
12    background-color:#1fab89;
13    border-bottom:1px solid #CCCCCC;
14}
15.header-left{
16    display:flex;
17}
18.header-logo{
19    height:65px;
20    width:65px;
21    display:inline-block;
22    margin-top:12.5px;
23    margin-left:15px;
24    border-radius:50%;
25}
26header h1{
27    color:white;
28    margin-top:22px;
29    margin-left:4px;
30}
31.top{
32    height:300px;
33    background-image:url("image/title-image.jpg");
34    background-size:contain;
35    background-size:cover;
36}
37.navi{
38    height:55px;
39    background-color:#62d2a2;
40    display:inline-block;
41    width:100%;
42    display:flex;
43}
44.menu{
45    border-left:1px dashed white;
46    height:55px;
47    line-height:55px;
48    width:20%;
49}
50.menu:hover{
51        background-color:#239b76;
52        transition:background-color 0.5s;
53    }
54.menu a{
55    color:white;
56    display:inline-block;
57    width:100%;
58    text-align:center;
59    text-decoration:none;
60}
61.home{
62    border-left:none;
63}
64.main{
65    height:700px;
66}
67.description{
68    margin-top:100px;
69    padding:0 140px 0 140px;
70}
71.description p{
72    font-family:Open Sans;
73    width:100%;
74    text-align:center;
75    line-height:40px;
76}
77.main{
78
79}
80.main img{
81    width:50%;
82    height:auto;
83}
84footer{
85    background-color:#d7fbe8;
86    height:90px;
87}
88footer p{
89    width:100%;
90    height:90px;
91    line-height:90px;
92    text-align:center;
93}

miyabi_pudding

2020/01/21 06:37

<div class="menu pic"> </div> と、ガッツリ入っているように見えますが。

行動規範の内容に同意します

回答3件

セレクタが一致するものが、コード内から見つかるかと思います。

html
1                <div class="menu pic">
2
3                </div>

投稿2020/01/21 06:36

maisumakun

総合スコア145184

  <div class="menu pic">

                </div>

ここの事ですか？

投稿2020/01/21 06:40

rinp

総合スコア12

自己解決

div menu picをdiv picにすることで解決しました。

投稿2020/01/21 06:35

reo_fukkase

総合スコア50

m.ts10806

2020/01/21 06:39

タイトルと解決手法が一致してないと思います。質問に「どうしたいのか」をきちんと記載されては。でないとせっかくの問題提起が、質問者以外状況や背景がわからないものとなり、誰にもなんの参考にもならない負の資産となりえます。

hatena19

2020/01/21 06:47

ひょっとしてHTMLの <div class="menu pic"> がCSSセレクタでは、div.menu.pic となるということが理解できていなかったとか。

m.ts10806

2020/01/21 07:00

hatena19さん確かに、並列指定は慣れないと違和感ありますね。

hatena19

2020/01/21 07:03

私も最初は戸惑いました。

行動規範の内容に同意します

あなたの回答

tips

プレビュー

行動規範の内容に同意します

質問の解決につながる回答をしましょう。サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。また、読む側のことを考えた、分かりやすい文章を心がけましょう。

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

ただいまの回答率
85.48%

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

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

質問する

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

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

意図しない場所に作ったはずのない要素があり、それを消したいです。青い部分です。コードのどこでこれが生まれているのかを見つけられませんでした。お願いします。

関連した質問