css Layout

erst mal hallo alle zusammen,
ich habe erst vor 2 tagen mit HTML angefangen weil ich mir mal meine eigene Homepage Bauen wollte.

mein problem ich habe von einem freund ein layout bekommen und da war eine datei drin und da standen diese dinge drin:

/* standard elements */
* {
margin: 0;
padding: 0;
}

a {color: #682;}

a:hover {color: #9A6;}

body {
background: #333 url(img/bg.gif);
color: #333;
font: normal 62.5% "Lucida Sans Unicode",sans-serif;
margin: 3% 0;
}

p,ul {
padding-bottom: 1em;
}

ul {margin-left: 1.2em;}

.main_right li {list-style: none;}
/*.main li {list-style-image: url(img/li.gif);}*/

h1 {font-size: 1.2em;}

blockquote {
background: #FFF;
border-bottom: 1px solid #EEE;
border-top: 1px solid #EEE;
color: #333;
display: block;
font-size: 0.9em;
margin-bottom: 1.2em;
padding: 6px 12px;
}
blockquote p {padding: 3px 0;}

h1,h2,h3 {color: #994;}

/* misc */
.clearer {clear: both;}
.main_right .padded {padding: 6px 2px 6px 16px;}
.main .padded {padding: 18px 24px;}
.meta {font-size: 0.8em; color: #666;}
.left {float: left;}
.right {float: right;}

/* structure */
.container {
font-size: 1.2em;
background: url(img/bgcontainer.gif) repeat-y;
margin: 0 auto;
width: 840px;
border: 12px solid #222;
}

/* header */
.header {
float: left;
width: 640px;
background: url (img/header.jpg) no-repeat;
font: normal 2.4em Verdana,sans-serif;
line-height: 150px;
text-align: center;
}

/* structure */
.top {
background: #222;
color: #DDD;
float: left;
font: normal 1.4em Verdana;
height: 50px;
text-align: center;
width: 639px;
}
.subnav {
float: left;
width: 160px;
}
.main {
float: left;
width: 480px;
}
.main_right {
float: right;
width: 200px;
color: #CCC;
}

/* sub-navigation */
.subnav h1 {
background: #222;
color: #FFE;
font: bold 1.1em Verdana,sans-serif;
line-height: 24px;
padding-left: 8px;
}
.subnav ul {margin: 0; padding: 0;}
.subnav li {
border-bottom: 1px solid #696755;
list-style: none;
}
.subnav li a {
background: #89866F;
color: #111;
display: block;
padding: 8px 0 8px 12px;
width: 148px;
text-decoration: none;
}
.subnav li a:hover {
background: #9C997C;
color: #000;
}

/* footer */
.footer {
background: url(img/bgfooter.gif) repeat-x;
color: #CCC;
font-size: 0.9em;
line-height: 39px;
width: 100%;
text-align: center;
}
.footer .left,.footer .right {padding: 0 16px;}
.footer a {color: #EEE;}
.footer a:hover {color: #FAFCB0;}

.post{margin:0 0 25px 0;}

.post .info{
padding:2px 3px 3px 8px;
border:1px solid #e3e4e4;
background-color:#f5f5f5;
font-size:0.9em;
color:#505050;
}

/* Comments Styling */
#commentlist li {
margin-bottom: 1.5em;
padding-bottom: 1em;
border-bottom: 1px solid #700000;
}

#commentform {
margin: 1em 0;
background: #F7F7F7;
width: 280px;
}

#commentform textarea {
background: #f8f7f6;
border: 1px solid #d6d3d3;
width: 280px;
}
#commentform textarea:hover {
background: #FFFFFF;
border: 1px solid #d6d3d3;
}
#commentform textarea:focus {
background: #ffffff;
border: 1px solid #939793;
}

#commentform #email, #commentform #author, #commentform #url {
font-size: 1.1em;
background: #f8f7f6;
border: 1px solid #d6d3d3;
width: 280px;
}
#commentform #email:hover, #commentform #author:hover, #commentform #url:hover {
font-size: 1.1em;
background: #ffffff;
border: 1px solid #d6d3d3;
width: 280px;
}
#commentform #email:focus, #commentform #author:focus, #commentform #url:focus {
font-size: 1.1em;
background: #ffffff;
border: 1px solid #939793;
width: 280px;
}
#commentform input{
margin-bottom: 3px;
}

.post ul li
{
list-style:square;
margin-left:18px;
padding:5px;
}

.entry ol li
{
padding:5px;
list-type:decimal;
margin-left:22px;
}

.main_right a:link, a:visited {
color: #999999;
}
.main_right a:link,.main_right a:visited{
color: #666666;
text-decoration: none;
}

.main_right ul {
padding: 0;
}
.main_right ul li a:link,.main_right ul li a:visited{
display: block;
}
.main_right ul li:hover{
background: #333333;
}
.main_right ul li {
padding: 5px 0;
}
.main_right ul {
margin: 0;
}

so sollte es aussehen:

[Blockierte Grafik: http://www.oyla2.de/userdaten/97279735/bilder/jjjjjjjj.jpg]

aber bei mir sieht es so aus:
[Blockierte Grafik: http://www.oyla2.de/userdaten/97279735/bilder/323333.jpg]

ich weiß zwar das, das css ist aber was soll ich nun damit machen?
hoffe mir kann einer helfen

Gruß Cyberlord

hi

also ich bekomme das einfach nicht hin :x
ich habe mir die seiten durchgelesen aber irgendwie verstehe ich das nicht ganz genau wie und wo ich die sachen einfügen soll die css codes.
Mein kollege meinte das er das layout nicht selber sondern nur auf einer seiter runterdeladen hatte.
habe auch in den HTML codes
<link rel="stylesheet" href="design.css" type="text/css">
eingefügt aber nichts passiert, habe alle sachen hochgeladen nichts.
meine index datei sieht so aus:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>

<head>

<meta http-equiv="content-type" content="text/html; charset=iso-8859-1"/>
<meta name="description" content="description"/>
<meta name="keywords" content="keywords"/>
<meta name="author" content="author"/>
<link rel="stylesheet" type="text/css" href="default.css" media="screen"/>

<title>~*~*~Cyber Page~*~*~</title>

<!-- CSS -->
<link rel="stylesheet" href="design.css" type="text/css">

</head>

<body>

<div class="container">

<div class="header">Dark Ritual</div>

<div class="main_right">

<div class="padded">
<h1>Meine Homepage</h1>
<p>Ich Hoffe es mach euch spass hier auf meiner Seite.</p>

<h1>[GER]Schlachthof</h1>
<p>ist ein Counter Strike 1.6 Clan mehr infos hier <a href="SCHLACHTHOF.html">[GER]Schlachthof</a>.</p>

<h1>under construction</h1>
<p>under construction</p>

</div>

</div>

<div class="subnav">

<h1>ICH</h1>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="Ich.html">&Uuml;ber mich</a></li>
<li><a href="SCHLACHTHOF.html">[GER]Schlachthof</a></li>
<li><a href="Familie.html">Meine Familie</a></li>
</ul>

<h1>verschiedenes</h1>
<ul>
<li><a href="Friends.html">Friends</a></li>
<li><a href="Sachen.html">Meine Lieblings Sachen</a></li>
<li><a href="Videos.html">Videos</a></li>
<li><a href="http://cyberlord.kostenloses-forum.com/board/index,nxu,11898014nx5482.html">Forum</a></li>
</ul>

<h1>under construction</h1>
<ul>
<li><a href="">under construction</a></li>
<li><a href="">under construction</a></li>
<li><a href="">under construction</a></li>
<li><a href="">under construction</a></li>
</ul>

</div>

<div class="main">

<div class="padded">

<br />

<p><font color="red""><body>
<table cellpadding="1" cellspacing="1">
<p></p>

</div>

</div>

<div class="clearer"><span></span></div>

<div class="footer">

<div class="clearer"><span></span></div>

</div>

</div>

</body>

</html>

Gruß
Cyberlord