Jump to content

Why aren't the html and css pages with same code producing the same output?


tigertiger
 Share

Recommended Posts

This is a layout question about mostly done homework.If you go on http://sidetrack1.de...7?_sid=597d29d3 you'll see what it's suppose 2b like,what it looked like last semester and what I have. For some reason what I have right now is far off from what it's suppose 2b like '~`.There nearly identical (except for commented things) but why are the outputs on Chrome different :( ?.--------------------------------Theses are my present HTML and CSS sheets

<!DOCTYPE html><html>  <head><!--  statement of authorship  <section id="activities"--><script src="modernizr-2.js"></script><title>Fiji Sunset Spa and Resort Gift Shop</title><link rel="stylesheet" href="printstyles2.css" type="text/css"/><link rel="stylesheet" href="spastyles2.css" type="text/css"/><style type="text/css">#container{  background-image:url('images/texture_background.jpg');  background-repeat:repeat;  }   aside {  width:30%;  float:left;  padding:0.75%;  background-color:#f3da79;   border: 2px solid red;  }   #main {  float:right;  margin-left:3%;  padding:0.75%;  background-color:#f3da79;   border: 2px solid red;  }   h1 {  text-align:center;  }   h2{  text-align:center;  }   ul {  margin-left:1.5em;  padding-top:1em;  }</style></head><body><div id="container"><header><a href="spa.htm"><img src="images/fijispa.jpg" alt="Fiji Spa - outdoor massage" /></a></header> <!--end header--><nav><ul><li><a href="#">Directions</a></li><li><a href="#">Reservations</a></li><li><a href="#">Lunch Menu</a></li><li><a href="#">Dinner Menu</a></li><li><a href="gift2.html">Gift Shop</a></li><li><a href="#">Contact Us</a></li></ul></nav><div><aside><h2>Gift Cards</h2><ul><li>We are pleased to announce that the SpaCard gift card is now available. Use your SpaCardat any restaurant or at any of our shops that charge an additional fee for service.</li><li>Use your SpaCard at our hair and beauty salon and receive 10% off any service.</li><li>Watch for the SpaCard specials posted at the entrance to each restaurant. To find out moreabout the benefits of having a SpaCard, speak to the concierge or to any of our sales associates.</li></ul></aside><section id="main"><h1>Our Gift Shop</h1><p>Our gift shop has all the souvenirs you want, but in addition, we now have a full line of sportswear inevery size and at every price point. We even have our own line of designer sportswear customized with the Sundown logo.You can wear these items anywhere and be in style no matter what the season or the setting.</p><p>Come to the gift shop and try on shorts, shirts, and swimwear. We have hooded jackets as well for thosesummer nights when there still is a chill in the air. We also have a fully equipped dive shop. In addition, wecarry a full line of handy personal items.</p><p>If you are looking for a snack before or after our main dining facilities close, come to the gift shopand have some coffee, tea, juice, and a light breakfast. We have sitdown and takeout service as well.</p><p>Stock up on healthful snacks and low-calorie, high-carb beverages before any excursion.</p><p>We want you to know that we value your patronage, and we want you to enjoy every part of your stay here.It's the memories of your visit that will be priceless.</p><!-- end mainmargin-right: 1em;padding-right:5em;--></section></div><footer><h4>The Fiji Sunset Spa and Resort Gift Shop • Open each day from 7 a.m. to 11 p.m.</h4></footer> <!-- end footer --></div> <!-- end div container --></body></html>

* {  margin:0 px;  padding:0 px;	  }body{margin:0;	padding:0;	padding-top:10px;	text-align:center;background-color:white;font-size:0.9em;font-family:Arial,Verdana,Helevetica,sans-serif;}#container  {  width:90%;  margin-top:10 px;  margin-bottom:10px;  margin-left:auto;  margin-right:auto; /* auto allows the size 2b moded 2 fit in2 the container */  border-width:2px wide,solid,black;  border-radius:22px;  }header {background-color:darkkhaki;border-top-left-radius:20px;border-top-right-radius:20px;text-align:center;}     nav {padding:0.5em;background-color:darkkhaki;text-align:center;} nav ul li{display:inline;list-style-type:none;background-image:url(texture_background.jpg);	background-repeat:repeat;} nav a{padding:0.25em;color:#5c4033;font-weight:bold;text-decoration:none;} /* u finished this all already */ nav a:hover{color:black;background-color:goldenrod;text-decoration: underline;} #activities{width:20%;float:left;background-image:url(images/texture_background.jpg);background-repeat:repeat;}#activities h3{margin-bottom:0.5em;background-color:goldenrod;font:white;text-align:centered;text-transform:uppercase;} #spa h2{   background-color:goldenrod;   text-align:center;   color:white;   margin-bottom:0.5 em;   text-transform:uppercase;} #activities p{padding:0% 1% 1% 5%;} /*#main{float:left;}*/ #main h1{margin-bottom:1em;text-align:center;}  footer{clear:both;margin-top:1em;padding:1em auto 1em auto;border-top:solid black;border-width:2px;clear:both;font-weight:bold;text-align:center;}figure{text-align:center;}

*{  size: 8.5in 11in;margin:0.5in;}nav{/* display:none; */display:all;} header{/* display:none; */display:all;} body{   /* size: 8.5in 11in;margin:0.5in;*/color:black;background-color:white;font-size:12 pt;font:"Times New Roman" , Times ,serif ;line-height:120%;}

=======================================here is the old more visually correct code below=======================================

<!DOCTYPE html><html>  <head>	<script src="modernizr-2.js"></script>	<title>Fiji Sunset Spa and Resort Gift Shop</title>   <style type="text/css">  #container{  background-image:url(images/texture_background.jpg);  background-repeat:repeat;  }   aside {  width:30%;  float:left;  padding:0.75%;  background-color:#f3da79;  }   #main {  float:right;  width:65%;   margin-left:3 %;  padding:0.75%;  background-color:#f3da79;  }   h1 {  text-align:center;  }   h2{  text-align:center;  }   ul {  margin-left:1.5em;  padding-top:1em;  }   </style>    </head>   <body>  	<div id="container">	  <header>		<p>		  <a href="spa.htm"><img src="images/fijispa.jpg" alt="Fiji Spa - outdoor massage" /></a>	<link href="spastyles.css" rel="stylesheet" type="text/css" />	  <link href="printstylesTHATMAKESGIFTshowstuff.css" rel="stylesheet" type="text/css" />		</p>	  </header>  	  <nav>		<ul>		  <li><a href="#">Directions</a></li>		  <li><a href="#">Reservations</a></li>		  <li><a href="#">Lunch Menu</a></li>		  <li><a href="#">Dinner Menu</a></li>		  <li><a href="gift.htm">Gift Shop</a></li>		  <li><a href="#">Contact Us</a></li>		</ul>	  </nav>	  <aside>		<h2>Gift Cards</h2>		<ul>		  <li>We are pleased to announce that the SpaCard gift card is now available. Use your SpaCard at any restaurant or at any			  of our shops that charge an additional fee for service.</li>		  <li>Use your SpaCard at our hair and beauty salon and receive 10% off any service.</li>		  <li>Watch for the SpaCard specials posted at the entrance to each restaurant. To find out more about the benefits of			  having a SpaCard, speak to the concierge or to any of our sales associates.</li>		</ul>	  </aside>	  <nav id="main">		<h1>Our Gift Shop</h1>		<p>		  Our gift shop has all the souvenirs you want, but in addition, we now have a full line of sportswear in every size and		  at every price point. We even have our own line of designer sportswear customized with the Sundown logo. You can wear		  these items anywhere and be in style no matter what the season or the setting.		</p>		<p>		  Come to the gift shop and try on shorts, shirts, and swimwear. We have hooded jackets as well for those summer nights		  when there still is a chill in the air. We also have a fully equipped dive shop. In addition, we carry a full line of		  handy personal items.		</p>		<p>		  If you are looking for a snack before or after our main dining facilities close, come to the gift shop and have some		  coffee, tea, juice, and a light breakfast. We have sitdown and takeout service as well.		</p>		<p>		  Stock up on healthful snacks and low-calorie, high-carb beverages before any excursion.		</p>		<p>		  We want you to know that we value your patronage, and we want you to enjoy every part of your stay here. It's the		  memories of your visit that will be priceless.		</p>	  </nav>	  <footer>		<h4>The Fiji Sunset Spa and Resort Gift Shop • Open each day from 7 a.m. to 11 p.m.</h4>	  </footer>	</div>  </body></html>

*{margin:0 px;padding: 0 px;} body{margin:0;padding:0;padding-top:10px;text-align:center;background-color:white;font-size:0.9 em;font-family:Verdana, Arial, Helvetica, sans-serif;}   #container{width:90%;margin-top:10 px;margin-bottom:10px;margin-left:auto;margin-right:auto;border-width:2px wide, solid,black;border-radius:22px;} header{background-color:darkkhaki;border-top-left-radius:20px;border-top-right-radius:20px;text-align:center;}nav {padding:0.5 em;background-color:darkkhaki;text-align:center;}nav ul li{display:inline;list-style-type:none;background-image:url(texture_background.jpg);background-repeat:repeat;}nav a{padding:0.25em;color:#5c4033;font-weight:bold;text-decoration:none;}nav a:hover{   text-decoration: underline;   color:black;   background-color:goldenrod;}#activities{width:20%;float:left;background-image:url(images/texture_background.jpg);background-repeat:repeat;}#activities h3{   background-color:goldenrod;   text-align:center;   color:white;   margin-bottom:0.5 em;   text-transform:uppercase;  }#spa h2{   background-color:goldenrod;   text-align:center;   color:white;   margin-bottom:0.5 em;   text-transform:uppercase;  }#activities p{padding: 0% 1% 1% 5%;}#main h1{margin-bottom:1em;text-align:center;}footer{margin:1em auto 1em auto;padding:1em 0em 1em 0em;border-top:solid black ;border-width:2 px;clear:both;font-weight:bold;text-align:center;} figure{text-align:center;}

*{  size: 8.5in 11in;margin:0.5in;} nav{display:all;} header{display:all;} body{color:black;background-color:white;font-size:12 pt;font:"Times New Roman" , Times ,serif ;line-height:120%;}

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...