Here is my html code and my css is below that. The site is simple and I am
just trying to test my coding to see if it responds the same for difference
montior sizes.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"
http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>Great Gift Ideas For Pets And Their People</title>
<meta name="keywords" content="dog gifts, gifts under $10, dog collar,
personalized collar, personalized dog collar,nascar for dogs, NFL for dogs,
football jersey for dogs, MLB for dogs, jersey for dogs, baseball jersey for
dogs, ornament" />
<link rel="stylesheet" type="text/css" href="homepage-style.css">
</head>
<body>
<div id="header">
<h1>Cleveland Pet Store.Com</h1>
<h2>Gifts For Pets And Their People</h2>
</div>
<div id="countdown-image"
<a href="
http://siggiez.com/countdownz/ch/index2.cgi">
<img src="
http://siggiez.com/countdownz/ch/bans/03.jpg" width="600"
height="60" border="0" title="Siggiez Countdown Banners"></a>
</div>
<div id="content">
<div id="navbar">
</div>
<div id="main-text">
<h3>Featured Gifts Under $10</h3>
<img src="images/pawprintornament.jpg" alt=" Paw Print ornament"/>
<img src="images/santapawscard_details.jpg" alt="Santa Paws Rawhide Card"/>
<img src="images/petsmartcollar.jpg" alt="Personalized Collar"/>
</div>
</div>
</body>
</html>
CSS Code:
body {background-color: #ffffff;
margin: 0;}
#header {background-color: #ffffff;
margin: .5em;}
h1 {color: #800000;
font-size: 2.5em;
text-align: center;}
h2 {color: #000000;
font-size: 1.25em;
font-weight: bold;
text-align: center;
margin: 2em;}
#content {position: relative;
width: 779px;}
#countdown-image {text-align: center;
position: relative;
background-color: #ffffff;
margin: .5em;
margin-top: 0px;}
#main-text { background-color: #ffffff;
margin-left: 198px;
margin-top: 32px;
border: solid 1px #800000;}
h3 {color: #800000;
font-size: 1.5em;
text-align: center;}
#navbar {position: absolute;
top: 32px;
left:0px;
background-color: #ffffff;
width: 182px;
margin-right: .5em;
margin-left: .5em;}