I have the following html code: <!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Tr
ID: 3686265 • Letter: I
Question
I have the following html code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>Tasha-Gail Taylor Resume</title>
<meta http-equiv="Content-Type" content=
"text/html; charset=us-ascii" />
<meta name="author" content="Tasha-Gail Taylor" />
<meta name="description" content=
"This website has Tasha-Gail Taylor"s Resume" />
<meta name="keywords" content=
"Tasha-Gail Taylor, resume, cv, Digital Forensics, work experience, education, skills, awards" />
</head>
<style>
body {
background-color: #6699ff;
}
p {
}
h1 {
color: maroon;
text-align: center;
}
</style>
<body>
<h1>Tasha-Gail Taylor's Resume</h1>
<p>This website features the digital resume of Tasha Taylor, who
is a student at the University at Albany. This website offers
personal information about herself, with details on her career
goals, skills, accomplishments, educational activity and work
experience</p>
<div id="main">
<h2 {
background-color: #00ff80;
text-align: center;
padding-left: 15px;
padding-right: 15px;
padding-bottom: 15px;
height: 80%;
}
</div>
<h2>Related Awards and Skills</h2>
<div id="navcol">
<h3 {
background-color: #038134;
text-align: center;
width: 33%;
height: 78%;
float: left;
}
</div>
<h3>Related Links</h3>
<ul>
<li>Item 1</li>
</ul>
</div>
<div id="centcol">
<h3 {
background-color: #02da34;
text-align: center;
width: 33%;
height: 78%;
float: left;
}
</style>
</div>
<h3>Awards</h3>
<ul>
<li>1199 SEIU Scholarship</li>
<li>Spellman Achievment Awards</li>
<li>National Society of Leadership</li>
<li>Dean List 2013-2016
</ul>
</div>
<div id="rgtcol">
<style>
#rgtcol {
background-color: #0238da;
text-align: center;
width: 33%;
height: 78%;
float: left;
}
</style>
</div>
<h3>Skills</h3>
<ul>
<li>Retail Service</li>
<li>Microsoft Office</li>
<li>Critical and creative thinking</li>
<li>Cyber Forensic Software Acquistion</li>
</ul>
</div>
Email me: <a href=
"mailto:tmtaylor@albany.edu">tmtaylor@albany.edu</a></div>
</body>
</html>
I need to add the following .css code into it:
body {
background-color: #6699ff;
}
p {
}
h1 {
color: maroon;
text-align: center;
}
h2 {
}
h3 {
}
div {
text-align: center;
}
ul {
list-style-type: none;
text-align: left;
}
li {
}
#main {
background-color: #00ff80;
padding-left: 15px;
padding-right: 15px;
padding-bottom: 15px;
height: 80%;
}
#navcol {
background-color: #038134;
width: 33%;
height: 78%;
float: left;
}
#centcol {
background-color: #02da34;
width: 33%;
height: 78%;
float: left;
}
#rgtcol {
background-color: #0238da;
width: 33%;
height: 78%;
float: left;
}
Explanation / Answer
Your code had few unnecessary divs, so i removed them and below is the code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<link rel=stylesheet type="text/css" href="C:/Users/karrk/Desktop/style.css" />
<title>Tasha-Gail Taylor Resume</title>
<meta http-equiv="Content-Type" content=
"text/html; charset=us-ascii" />
<meta name="author" content="Tasha-Gail Taylor" />
<meta name="description" content=
"This website has Tasha-Gail Taylor"s Resume" />
<meta name="keywords" content=
"Tasha-Gail Taylor, resume, cv, Digital Forensics, work experience, education, skills, awards" />
</head>
<body>
<h1>Tasha-Gail Taylor's Resume</h1>
<p>This website features the digital resume of Tasha Taylor, who
is a student at the University at Albany. This website offers
personal information about herself, with details on her career
goals, skills, accomplishments, educational activity and work
experience</p>
<div id="main">
<h2>Related Awards and Skills</h2>
<div id="navcol">
<h3>Related Links</h3>
<ul>
<li>Item 1</li>
</ul>
</div>
<div id="centcol">
<h3>Awards</h3>
<ul>
<li>1199 SEIU Scholarship</li>
<li>Spellman Achievment Awards</li>
<li>National Society of Leadership</li>
<li>Dean List 2013-2016
</ul>
</div>
<div id="rgtcol">
<h3>Skills</h3>
<ul>
<li>Retail Service</li>
<li>Microsoft Office</li>
<li>Critical and creative thinking</li>
<li>Cyber Forensic Software Acquistion</li>
</ul>
</div>
Email me: <a href=
"mailto:tmtaylor@albany.edu">tmtaylor@albany.edu</a></div>
</body>
</html>
CSS:
body {
background-color: #6699ff;
}
p {
}
h1 {
color: maroon;
text-align: center;
}
h2 {
}
h3 {
}
div {
text-align: center;
}
ul {
list-style-type: none;
text-align: left;
}
li {
}
#main {
background-color: #00ff80;
padding-left: 15px;
padding-right: 15px;
padding-bottom: 15px;
height: 80%;
}
#navcol {
background-color: #038134;
width: 33%;
height: 78%;
float: left;
}
#centcol {
background-color: #02da34;
width: 33%;
height: 78%;
float: left;
}
#rgtcol {
background-color: #0238da;
width: 33%;
height: 78%;
float: left;
}