Hallo liebe xhtmlforum Mitglieder,
Ich habe folgendes Problem:
Ich möchte, dass ein <div> Container ganz unten an der Seite angezeigt wird.
So sieht es momentan aus:
Dies sollte nun aber so aussehen:
Hier ist der Quellcode der Seite:
Code:
<?xml version="1.0" encoding="utf-8"?>
<?xml-stylesheet href="./deviled.css" type="text/css" media="screen"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head><title>NewMedia Dorsten</title>
<style type="text/css">
body {
margin:0px 0px 0px 0px;
padding:0px;
background: #fff url(images/bg.png) repeat-y 50% 0;
text-align: center;
}
a {
text-decoration:none;
font-weight:bold;
color:#c00;
}
.head1 {
width: 815px;
height: 82px;
background-color: #fff;
margin-right: auto;
margin-left: auto;
}
#logo {
background: url("images/logo.png") no-repeat;
width: 147px;
height: 82px;
position: relative;
float: left;
}
#logo h1 { display: none; }
#od {
background: url("images/od.png") no-repeat;
width: 232px;
height: 82px;
position: relative;
float: left;
}
#linkhaupt {
vertical-align: bottom;
background-color: #f3f3f3;
width: 109px;
height: 82px;
position: relative;
float: left;
font-family: Trebuchet MS, Arial;
font-size: 12px;
color: #6e6e6e;
line-height:11;
list-style: none;
}
#linkhaupt:hover {
background-color: #3f3f3f;
color: #fff;
line-height:12;
}
#dienst {
background-color: #f3f3f3;
width: 109px;
height: 82px;
position: relative;
float: left;
font-family: Trebuchet MS, Arial;
font-size: 12px;
color: #6e6e6e;
line-height:11;
list-style: none;
}
#dienst:hover {
background-color: #44baba;
color: #fff;
line-height:12;
}
#refe {
background-color: #f3f3f3;
width: 109px;
height: 82px;
position: relative;
float: left;
font-family: Trebuchet MS, Arial;
font-size: 12px;
color: #6e6e6e;
line-height:11;
list-style: none;
}
#refe:hover {
background-color: #ff0044;
color: #fff;
line-height:12;
}
#port {
background-color: #f3f3f3;
width: 109px;
height: 82px;
position: relative;
float: left;
font-family: Trebuchet MS, Arial;
font-size: 12px;
color: #6e6e6e;
line-height:11;
list-style: none;
}
#port:hover {
background-color: #76d400;
color: #fff;
line-height:12;
}
#header {
background: url("images/header.png") no-repeat;
width: 813px;
height: 178px;
position: relative;
float: left;
}
#footer {
background-color: #76d400;
width: 813px;
height: 20px;
position: relative;
float: left;
}
.copyright {
font-family: Trebuchet MS, Arial;
font-size: 11px;
color: #fff;
}
</style>
</head><body>
<div class="head1">
<div id="logo"><h1>Newmedia Dorsten</h1></div>
<div id="od"></div>
<ul style="margin: 0; padding: 0">
<li onclick="javascript:document.location.href='#'" id="linkhaupt">Hauptseite
<li onclick="javascript:document.location.href='#'" id="dienst">Dienstleistungen
<li onclick="javascript:document.location.href='#'" id="refe">Referenzen
<li onclick="javascript:document.location.href='#'" id="port">Portfolio[/list]<div id="header"></div>
<div id="footer">
<span style="vertical-align:super;float: left;" class="copyright">Hauptseite // Dienstleistungen // Referenzen // Portfolio</span>
<span style="vertical-align:super;float: right;" class="copyright">Diese Seite wurde in <acronym title="Cascading Style Sheets">CSS</acronym> und <acronym title="Extensible HyperText Markup Language">XHTML</acronym> entwickelt.</span>
</div>
</div>
</body>
</html>
Ich hoffe ihr wisst, wie man so etwas hinkriegen kann.
Vielen Dank für die kommenden Antworten