I'm new in web design. In this project I am trying to set background-color for 5 div elements with the id of them. 3 of them work but the last 2 divs (drink and food) don't get colored .I also tried to rearrange and rename the elements or change elements into p tag but all of them had the same problem. here is my code and result:here is image link
<html>
<head>
<style>
body
{
padding:0px;
margin:0px;
}
#navigationbar
{
width:100%;
height:131px;
position:absolute;
top:526px;
}
.d1
{
font-weight:bold;
text-align:center;
font-size:20pt;
width:20%;
height:100%;
float:left;
margin:0px;
}
.p1
{
margin-top:65px;
}
#breakfast
{
background-color:red;
}
#sweets
{
background-color:#ff1a1a;
}
#appetizer
{
background-color:#009933;
{
#food
{
background-color:lime;
}
#drink
{
background-color:blue;
}
</style>
</head>
<body>
[enter image description here][1]<div id="navigationbar">
<div class="d1" id="breakfast"> <p class="p1"> Breakfast </p> </div>
<div class="d1" id="sweets"> <p class="p1"> Sweets </p> </div>
<div class="d1" id="appetizer"> <p class="p1"> Appetizer </p> </div>
<div class="d1" id="drink"> <p class="p1"> Drink </p> </div>
<div class="d1" id="food"> <p class="p1"> Food </p> </div>
</div>
</body>
</html>
Aucun commentaire:
Enregistrer un commentaire