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?

Originally Posted by CSS Code

<!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

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:

HTML Code:

<div class=.nav>

Use:

HTML Code:

<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.

HTML Code:

<!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

Thread: Whats wrong with my coding?

Thread Tools

Whats wrong with my coding?

Posting Permissions