CSS issue with college work

next-Jin

Supreme [H]ardness
Joined
Mar 29, 2006
Messages
7,388
Wife is in an HTML class and my vague experience with coding has been with Dreamweaver and using Photoshop to slice up everything.

She asked for my help and I don't understand whats wrong with this.

Code:
<!DOCTYPE html>

<head>

	<title>Pikes Peak Adventure Club</title>

	<style type=&#8220;text/css&#8221;>
		&#8220;wrapper&#8221; {border:thin grey solid;}
		&#8220;header&#8221; {width:auto;border:thin grey solid;}
		&#8220;body&#8221; {margin:0 auto;width:700px;}
		&#8220;navigation&#8221; {float:left;width:150px;background:lightgrey;}
		&#8220;content1&#8221; {margin-left:150px;padding:10px;}
		&#8220;footer&#8221; {border:thin grey solid;text-align:center;clear:both;}
	</style>

</head>
<body>
<!&#8212;- Call out the &#8220;wrapper&#8221; &#8220;header&#8221; &#8220;navigation&#8221; &#8220;content1&#8221; and &#8220;footer&#8221; using the &#8220;div id&#8221; tag. These will define each new section of the page&#8212;->
	<div id=&#8220;wrapper&#8221;>
	<div id=&#8220;header&#8221;>
		<h1>Pikes Peak Adventure Club</h1>
	</div>
	<div id=&#8220;navigation&#8221;>
		<h2>Navigation</h2>
		<ul>
			<li><a href=&#8220;index.html&#8221;>Home</a></li>
			<li><a href=&#8220;gallery.html&#8221;>Gallery</a></li>
			<li><a href=&#8220;testimonials.html&#8221;>Testimonials</a></li>
			<li><a href=&#8220;travel_blogs.html&#8221;>Travel Blogs</a></li>
			<li><a href=&#8220;contact.html&#8221;>Contact Us</a></li>
		</ul>
	</div>
	<div id=&#8220;content1&#8221;>
		<h2>Introduction</h2>
		<p>Some sample content, add your own here</p>
		<p>This is a sample box model. You will learn to expand on this as you learn to do more css coding.</p>
		<p>This is some sample text that I writing to complete this assignment. Although, I really have no idea if I am supposed to be writing three to four actual paragraphs or if I am supposed to create three to four new paragraphs in the code with some sample text. So I am going to do both to make sure that I get a good grade on this assignment.</p>
		<p>Ultimately, I am learning hy.</p>
		<p>Hugs from Landon is a Non-Profit Organization .</p> 
	</div>
	<div id=&#8220;footer&#8221;>
		<p>This is the footer of the page.</p>
	</div>
	</div>
</body>
</html>

The div ids look fine to me and the code seems ok from what I saw, I double checked the spaces as well.

I'm sure it's something simple but this is from her week 3 assignment and 4 is due today which can't be done until we figure this out.

Teacher responded 6 days late (today) saying the div id names were wrong but when we double check her examples from week 3 the shits the same so I got nothing now.

Hoping [H] can take a second look at this.
 
Last edited:
In your CSS declarations, IDs should be selected like this:

Code:
<style type=“text/css”>
	#wrapper {border:thin grey solid;}
	#header {width:auto;border:thin grey solid;}
	#body {margin:0 auto;width:700px;}
	#navigation {float:left;width:150px;background:lightgrey;}
	#content1 {margin-left:150px;padding:10px;}
	#footer {border:thin grey solid;text-align:center;clear:both;}
</style>
Not sure why it worked before but it was wrong. See here for a list of all the possible selectors.
 
This doesn't really apply at this stage but once you're building large, scaleable web applications you're going to want to kill any use of IDs in CSS.

That said, gilpo is correct.
 
You also want to use a text editor that doesn't use those special quotes that are higher in the code page.

Use " and not &#8220; or &#8221;.
 
Back
Top