Welcome to T.S.G alright this might be long, I can see that you are new to html and css, it's great to learn, but you seem to be confused about a few things you should take a look at
w3schools to learn html, now to the problem, there were a few issues with your internal CSS, these are highlighted below, anything in
red, should be removed, because it is incorrect or un-needed, anything in
green is what needs to be added or changed
keep in mind this is only for the head(mostly css)
Quote:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta name="generator" content="HTML Tidy for Linux (vers 6 November 2007), see www.w3.org">
<title>cup du jour: House and Bakery</title>
<style type="text/css">
body {
background: #003399;
font-family: verdana;
font-size:15px;
} div class=".container"{
width:600px;
margin:0 auto;
background:#ffffff;
border:#000000 3px solid;
} div class=".header" {
width:auto;
height:100px;
background:ffffff;
border-bottom:#000000 1px soild;
} div class= ".maincontainer"{
width:600px;
} div class= ".sidebar"{
width:200px;
border-right:#000000 1px dashed;
float-left;
} div class=".content"{
width:395px;
border:none;
float:right;
} div class=".footer"{
width:auto;
height:20px;
border-top:#000000 1px solid;
clear: both;
} </body>
</style>
</head>
<body>
|
now it maybe hard to see, but there is a period ( . ) before the name of the class, let explain what was wrong with the way you had it, in css, when defining a class you must start with a . or a # followed by the name of the class, the rest is correct, you also had an </body> inside your internal css... that was un-necessary... now what you need to do now(that your styles are defined correctly) is add the divs, and attach the appropriate style.
Quote:
<body><div class="container">
<div class="header">
<h1>cup du jour</h1>
<p><a href="index.html">Home</a> <a href="menu.html">Menu</a> <a href="events.html">Events</a> <a href="jobs.html">Jobs</a></p>
<ul></div>
<div class="sidebar">
<li>Specialty Coffee and Tea</li>
<li>Doughnts, Bagels and more!</li>
<li>music, Poetry and Karaoke!</li>
<li>Open Mic Night</li>
</ul></div> <div class="footer"><p>Cup Du Jour<br>
1234 N Main St.<br>
Opelousas, La<br>
1-888-123-4567<br></p>
<small><em>copyright ©2012 Cup Du Jour</em></small>
<p><small><a href="mailto:tyday2@hotmail.com">Tyrone LeDay</a></small></p> </div>
</body>
</html>
|
obviously, the placement of the <div class="..."> and </div> depends on where you want each div to start and end... and again the
green is what I added.
Hope this helps
-Luke