PDA

View Full Version : Whats wrong with my coding?



n00blet
08-02-2006, 08:23 PM
Its the first time I tried a CSS site without code sniffing and it ain't working out. Can anyone help me with it?



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
body {
BACKGROUND-COLOR: #008B8B; FONT-FAMILY: verdana,arial; FONT-SIZE: 10px
}
.nav {
background-color: #FFFFFF;
border-top: 0px solid #000000;
border-left: 1px solid #000000;
border-right: 1px solid #000000;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 2px;
color: #000000;
}
.content {
background-color: #F5F5F5;
border-top: 0px solid #000000;
border-left: 1px solid #000000;
border-right: 1px solid #000000;
color: #000000;
}
.footer {
.footer {
background-color: #333333;
border-left: 1px solid #333333;
border-right: 1px solid #333333;
border-top: 1px solid #333333;
color: #FFFFFF;
}
</style>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>CSS</title>
</head>
<body>
<div class=.nav> <div align="center"> Put Nav Here </div>
<div class=.content> <div align="center">Put The Content Here
<P>
HERE HERE HERE HERE
<br><br><br>
</div>
<div class=.footer>
<div align="center">Layout Created By n00blet - 2006</div>
</body>
</html>


They don't show up as boxes with borders. Any help appreciated

Recursion
08-02-2006, 08:25 PM
im absolutly Bobberish at CSS but i dont think it meant to be in the <HTML> tags. Thats a guess cos i dunno nefing about CSS lol

EDIT: Your not meant to use CSS for the actuall page. You have to link it in somehow...

n00blet
08-02-2006, 08:27 PM
The CSS is in the <style></style> tags if you would care to look :l
Also you mean the DIV's which are HTML :/

Recursion
08-02-2006, 08:29 PM
Gawd i only tried to help on the basis of my CSS knowledge (Which is absolute crud!)

Dakara
08-02-2006, 08:30 PM
You have put full stops before the class name, where it should have just the class name instead. The reason you have full stops in the CSS is because you're saying that it can be applied to any element.

For example instead of:

<div class=.nav>
Use:

<div class='nav'>

Edit: Also, you might as well just set the align with CSS rather than using the align attribute.

n00blet
08-02-2006, 08:32 PM
It totally mucks it up if you check

Recursion
08-02-2006, 08:34 PM
Well i dunno!

Dakara
08-02-2006, 08:50 PM
I've made a few changes, I've also marked what I've changed so you can learn from the changes.


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<style type="text/css">
body {
BACKGROUND-COLOR: #008B8B;
FONT-FAMILY: verdana,arial;
FONT-SIZE: 10px
}

.nav {
background-color: #FFFFFF;
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #000000;

border: 1px solid #000000; /* Fix */
font-size: 11px; /* Fix */
float: left; /* Fix */
width: 130px;
margin-right: 3px;
}

.content {
background-color: #F5F5F5;

border: 1px solid #000000;
color: #000000;
float: right; /* Fix */
width: 360px; /* Fix */
}

.footer {
background-color: #333333;

border: 1px solid #000; /* Fix */
border-top: none; /* Fix */
color: #FFFFFF;
float: right; /* Fix */
width: 360px; /* Fix */
}


/* Fixed bellow */
.container {
Width: 500px;
margin: 0 auto 0 auto;
}

li {
list-style: none;
}

p {
margin: 3px;
}
</style>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>CSS</title>
</head>

<body>
<div class='container'> <!-- Fix -->

<div class='nav'>

<li style='font-weight: bold; margin-top: 10px;'>Menu</li>
<!-- Fix -->
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li style='margin-bottom: 10px;'>Link</li>

</div>

<div class='content'>
<strong>Content</strong>
<p>
This is some example content.
</p>
</div>

<div class=footer>
Layout Created By n00blet - 2006
</div>

</div>
</body>
</html>

n00blet
09-02-2006, 06:45 PM
Thanks man +rep

Want to hide these adverts? Register an account for free!