Hilfe
Neues Thema
Antworten
geschrieben ich habe ein kleines Problem bei der Erstellung eines CSS-Layout und ich hoffe, dass ihr mir weiterhelfen könnt.
Hier erstmal der HTML Quelltext mit eingebetteten Stylesheets.
<!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" dir="ltr" lang="de-DE">
<head profile="http://gmpg.org/xfn/11">
<title>CSS Layout</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type="text/css">
<!--
body {
font-size:11px;
font-family:Verdana, Arial, Sans-Serif;
color:#333333;
background-color:#F3F3EB;
text-align:center;
margin:0px;
padding:0px;
}
#page {
width:930px;
background-color:#CCCCCC;
text-align:center;
margin:auto;
}
#header {
width:920px;
height:110px;
background-color:#4F4F18;
margin:auto;
}
#navi {
width:920px;
height:28px;
background-color:#993333;
margin:auto;
}
#footer_1 {
clear:both;
width:100%;
height:40px;
background-color:#000000;
}
#content_footer_1 {
font-size:11px;
color:#FFFFFF;
padding:3px 0px 0px 0px;
line-height:150%;
}
#column_content {
float:left;
width:650px;
}
#column_content_content {
padding:43px 0px 0px 43px;
}
#column_sidebar {
float:right;
width:280px;
}
#column_sidebar_content {
padding:0px 0px 0px 0px;
}
-->
</style>
</head>
<body>
<!-- Start Layer Page //-->
<div id="page">
<div id="header"></div>
<div id="navi"></div>
<div id="column_content">
<div id="column_content_content">
Das ist nur ein Blindtext, um die mittlere Spalte etwas aufzufüllen.
Das ist nur ein Blindtext, um die mittlere Spalte etwas aufzufüllen.
Das ist nur ein Blindtext, um die mittlere Spalte etwas aufzufüllen.
Das ist nur ein Blindtext, um die mittlere Spalte etwas aufzufüllen.
Das ist nur ein Blindtext, um die mittlere Spalte etwas aufzufüllen.
Das ist nur ein Blindtext, um die mittlere Spalte etwas aufzufüllen.
Das ist nur ein Blindtext, um die mittlere Spalte etwas aufzufüllen.
Das ist nur ein Blindtext, um die mittlere Spalte etwas aufzufüllen.
Das ist nur ein Blindtext, um die mittlere Spalte etwas aufzufüllen.
Das ist nur ein Blindtext, um die mittlere Spalte etwas aufzufüllen.
Das ist nur ein Blindtext, um die mittlere Spalte etwas aufzufüllen.
Das ist nur ein Blindtext, um die mittlere Spalte etwas aufzufüllen.
Das ist nur ein Blindtext, um die mittlere Spalte etwas aufzufüllen.
Das ist nur ein Blindtext, um die mittlere Spalte etwas aufzufüllen.
Das ist nur ein Blindtext, um die mittlere Spalte etwas aufzufüllen.
Das ist nur ein Blindtext, um die mittlere Spalte etwas aufzufüllen.
Das ist nur ein Blindtext, um die mittlere Spalte etwas aufzufüllen.
Das ist nur ein Blindtext, um die mittlere Spalte etwas aufzufüllen.
</div>
</div>
<div id="column_sidebar">
<div id="column_sidebar_content">
<ul>
<li>Navigationspunkt</li>
<li>Navigationspunkt</li>
<li>Navigationspunkt</li>
<li>Navigationspunkt</li>
<li>Navigationspunkt</li>
<li>Navigationspunkt</li>
<li>Navigationspunkt</li>
</ul>
</div>
</div>
</div>
<!-- Stop Layer Page //-->
<div id="footer_1">
<div id="content_footer_1">
Hier kommt der Abschluss der Seite
</div>
</div>
</body>
</html>
Soweit funktioniert auch alles,
bloß gibt es in Firefox, Safari und Opera das Problem, dass der Layer PAGE nicht über die ganze Seite geht, sondern nach der Navigation aufhört. Es ist so gedacht, dass die komplette Seite bis zum Fuß mit einem grauen Hintergrund hinterlegt sein sollte, aber in den genannten Browsern funktioniert das nicht - lediglich der IE stellt die Seite wie gewünscht dar.
Was habe ich falsch gemacht?
Nach oben
geschrieben 
