Hej Philip
Her har du koden, så det virker, har kommenteret nogle vigtige ting i css'en
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Nyt dokument</title>
<style type="text/css">
#wrapper {
width: 760px;
margin: 0 auto;
}
#header {
width: 760px;
height: 20px;
background: #FF0000;
}
#navigation {
width: 760px;
height: 20px;
background: #FF00CC;
clear: both;
}
#navigation ul {
list-style-type: none;
display: inline;
}
#navigation li {
margin-right: 10px;
float: left;
}
#logo {
float: left;
width: 300px;
}
#login {
float: left; /* Der er ingen grund til float: right, når du har angivet en bredde, så det passer med wrapperens bredde. Hvis det er fordi du vil have din login tekst som højrestillet, så skal du bruge text-align: right. :) */
width: 460px;
}
#content {
width: 760px;
background: #339900;
clear: both; /* Husk at clear alt efter et element som har en float :) */
}
#footer {
background: #00ffcc;
width: 760px;
}
* {
/*
Denne funktion går ind og fjerner alt forudbestemt style, som de forskellige browsere har. Det vil sige, du skal angive margin og padding på dine elementer
såsom H1, H2, H3, H4, H5, H6, code, pre, p osv.
Som du kan se har din list en forudbestemt padding og margin. Den kan du håndtere ens i alle browsere nu, med denne funktion.
Udover det, så er det et skide godt værktøj, når du især tager brug af list (ul li).
*/
margin: 0px;
padding: 0px;
}
</style>
</head>
<body>
<div id="wrapper">
<div id="header">
<div id="logo">LOGO HERE</div>
<div id="login">LOGIN HERE</div>
</div>
<div id="navigation">
<ul>
<li>Test</li>
<li>Test</li>
<li>Test</li>
<li>Test</li>
<li>Test</li>
</ul>
</div>
<div id="content">Dit indhold</div>
<div id="footer">Copyright © 2007</div>
</div><!-- wrapper end -->
</body>
</html>God fornøjelse og god weekend