初心者質問です。
下記の通り書いたのですが二つ目のdiv以降が表示されません。
原因がわからないので教えていただきたいです。
本当に初心者なので質問の内容が初歩的ですが宜しくお願い申し上げます。
HTML
<!DOCTYPE> <html> <head> <title></title></head> <body> <div class = container> <header>リアルわらしべ長者イベント</header><meta charset="UTF-8"> <title>リアルわらしべ長者イベント</title> <link rel="stylesheet" type="text/css" href="warashibe.css"> <meta name="viewport" content="width=device-width,initial-scale=1">
</div> <div class = detail> <h2>わらしべイベントとは</h2> </div> </body> </html><p class = "colabo">AXIS×CARRY</p> <img src="warashibe.jpg" class = "warashibe">
CSS
/幅が最後まで来るように設定/
html,body{
margin:0;
margin-top: 0px;
padding:0;
}
header{
color:gray;
text-align: center;
}
hr{
width: 100%;
}
.container{
background-color: cornsilk;
height: 900px;
position: absolute;
width: 100%;
}
h1{
color:gray;
text-align: center;
}
h2{
color:black;
font-size: 20px;
}
.colabo{
color: gray;
font-size: 30px;
text-align: center;
}
.warashibe{
border-radius: 10px;
bottom: 0;
display: block;
height: 60%;
margin-left: auto;
margin-right: auto;
text-align: center;
width: 66%;
}
.detail{
height: 100px;
width: 100%;
}