here is the code fix the uses and changes that were mentioned home.html=========
ID: 3589881 • Letter: H
Question
here is the code fix the uses and changes that were mentioned
home.html=============
<!DOCTYPE html>
<html>
<head>
<title>PIZZA PLANET</title>
<link rel = "stylesheet" href="style.css">
</head>
<body>
<div id="header">
<h1> PIZZA PLANET</h1>
<div id="menu">
<ul>
<li><a class="active" href="home.html">HOME</a></li>
<li><a href="menu.html">MENU</a></li>
<li><a href="contactus.html">CONTACT</a></li>
</ul>
</div>
</div>
<div id="body">
<img src="mainImg.jpg" alt="Blood Donate" width="1345px" height="600px">
</div>
</body>
</html>
menu.html=======================
<!DOCTYPE html>
<html>
<head>
<title>PIZZA PLANET</title>
<link rel = "stylesheet" href="style.css">
</head>
<body>
<div id="header">
<h1> PIZZA PLANET</h1>
<div id="menu">
<ul>
<li><a href="home.html">HOME</a></li>
<li><a class="active" href="menu.html">MENU</a></li>
<li><a href="contactus.html">CONTACT</a></li>
</ul>
</div>
</div>
<div id="body">
<table class="menu">
<tr><td>Pizza Marinara</td></tr>
<tr><td>Pizza Margherita</td></tr>
<tr><td>Chicago Pizza</td></tr>
<tr><td>New York Style Pizza</td></tr>
<tr><td>Sicilian Pizza</td></tr>
<tr><td>Greek Pizza</td></tr>
<tr><td>California Pizza</td></tr>
</table>
</div>
</body>
</html>
contactus.html==============
<!DOCTYPE html>
<html>
<head>
<title>PIZZA PLANET</title>
<link rel = "stylesheet" href="style.css">
</head>
<body>
<div id="header">
<h1> PIZZA PLANET</h1>
<div id="menu">
<ul>
<li><a href="home.html">HOME</a></li>
<li><a href="menu.html">MENU</a></li>
<li><a class="active" href="contactus.html">CONTACT</a></li>
</ul>
</div>
</div>
<div id="body">
<h2>Mail Us at :</h2>
<h2> <a href="mailto:pizzaplanet@example.com">pizzaplanet@example.com</a></h2><br>
</div>
</body>
</html>
style.css===============
body{
margin:0px;
background-color: #333333;
color:white;
}
#body{
width:100%;
background-color: #333333;
}
h1{
margin-top:0px;
padding-top:20px;
color:white;
text-align: center;
}
h2{
color:#c12705;
}
.menu {
margin-left: 550px;
margin-top: 50px;
}
table, td, th {
border: 1px solid #c12705;
text-align: center;
font-size:25px;
}
td:hover {background-color: #c12705}
form{
margin-left:10px;
}
#menu ul {
list-style-type: none;
margin:0px;
padding: 0;
overflow: hidden;
background-color: #232323;
}
#menu li {
float: left;
margin-left: 180px;
margin-right: 180px;
}
#menu li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
#menu li a:hover {
background-color: #c12705;
}
#menu .active {
background-color: #c12705;
}
#header {
background-color:#333333;
}
Explanation / Answer
In the nav bar contactus has already aligned,
i have add an image of pizza making to this code , please comment specifically if you need anything more
<!DOCTYPE html>
<html>
<head>
<title>PIZZA PLANET</title>
<link rel = "stylesheet" href="style.css">
</head>
<body>
<div id="header">
<h1> PIZZA PLANET</h1>
<div id="menu">
<ul>
<li><a class="active" href="home.html">HOME</a></li>
<li><a href="menu.html">MENU</a></li>
<li><a href="contactus.html">CONTACT</a></li>
</ul>
</div>
</div>
<div id="body">
<img src="https://ak8.picdn.net/shutterstock/videos/3691778/thumb/8.jpg" alt="Blood Donate" width="1345px" height="600px"> <!-- you can change it to any image you wish if you don't want alt just remove it -->
</div>
</body>
</html>
menu.html=======================
<!DOCTYPE html>
<html>
<head>
<title>PIZZA PLANET</title>
<link rel = "stylesheet" href="style.css">
</head>
<body>
<div id="header">
<h1> PIZZA PLANET</h1>
<div id="menu">
<ul>
<li><a href="home.html">HOME</a></li>
<li><a class="active" href="menu.html">MENU</a></li>
<li><a href="contactus.html">CONTACT</a></li>
</ul>
</div>
</div>
<div id="body">
<table class="menu">
<tr><td>Pizza Marinara</td></tr>
<tr><td>Pizza Margherita</td></tr>
<tr><td>Chicago Pizza</td></tr>
<tr><td>New York Style Pizza</td></tr>
<tr><td>Sicilian Pizza</td></tr>
<tr><td>Greek Pizza</td></tr>
<tr><td>California Pizza</td></tr>
</table>
</div>
</body>
</html>
contactus.html==============
<!DOCTYPE html>
<html>
<head>
<title>PIZZA PLANET</title>
<link rel = "stylesheet" href="style.css">
</head>
<body>
<div id="header">
<h1> PIZZA PLANET</h1>
<div id="menu">
<ul>
<li><a href="home.html">HOME</a></li>
<li><a href="menu.html">MENU</a></li>
<li><a class="active" href="contactus.html">CONTACT</a></li>
</ul>
</div>
</div>
<div id="body">
<h2>Mail Us at :</h2>
<h2> <a href="mailto:pizzaplanet@example.com">pizzaplanet@example.com</a></h2><br>
</div>
</body>
</html>
style.css===============
body{
margin:0px;
background-color: #333333;
color:white;
}
#body{
width:100%;
background-color: #333333;
}
h1{
margin-top:0px;
padding-top:20px;
color:white;
text-align: center;
}
h2{
color:#c12705;
}
.menu {
margin-left: 550px;
margin-top: 50px;
}
table, td, th {
border: 1px solid #c12705;
text-align: center;
font-size:25px;
}
td:hover {background-color: #c12705}
form{
margin-left:10px;
}
#menu ul {
list-style-type: none;
margin:0px;
padding: 0;
overflow: hidden;
background-color: #232323;
}
#menu li {
float: left;
margin-left: 180px;
margin-right: 180px;
}
#menu li a {
display: block;
color: white;
text-align: center;
padding: 14px 16px;
text-decoration: none;
}
#menu li a:hover {
background-color: #c12705;
}
#menu .active {
background-color: #c12705;
}
#header {
background-color:#333333;
}
Related Questions
Navigate
Integrity-first tutoring: explanations and feedback only — we do not complete graded work. Learn more.