eisenherz
Mitglied
Hallo zusammen,
ich hab da ein kleines Problem mit Divs.
Zwar gibs hier schon Threads mit ähnlichen Problemen, diese haben mir aber bei meiner Seite nicht weitergeholfen, weswegen ich einen neuen Thread aufmache...
Folgendes Problem:
Bei meinem Mehrspaltigen Zentrierten Dynamischen Layout ohne Tabellen überlappt der Content-Div den Footer-Div bei längeren Inhalten. Eigentlich sollte der Footer nach unten rutschen. Genaugenommen überlappt auch der Nav-Div den Conten-Div wenn dieser mehr Inhalt hat, was auf einen Denkfehler meinerseits schließen lässt.
Ich hab schon die Verschachtelung, Rechtschreibung hundertmal überprüft, aber ich komm nicht drauf was falsch läuft.
Folgend der HTML Code:
Und der CSS-Code
Wäre Super, wenn jemand den Fehler finden würde...
Gruß
Eisenherz
ich hab da ein kleines Problem mit Divs.
Zwar gibs hier schon Threads mit ähnlichen Problemen, diese haben mir aber bei meiner Seite nicht weitergeholfen, weswegen ich einen neuen Thread aufmache...
Folgendes Problem:
Bei meinem Mehrspaltigen Zentrierten Dynamischen Layout ohne Tabellen überlappt der Content-Div den Footer-Div bei längeren Inhalten. Eigentlich sollte der Footer nach unten rutschen. Genaugenommen überlappt auch der Nav-Div den Conten-Div wenn dieser mehr Inhalt hat, was auf einen Denkfehler meinerseits schließen lässt.
Ich hab schon die Verschachtelung, Rechtschreibung hundertmal überprüft, aber ich komm nicht drauf was falsch läuft.
Folgend der HTML Code:
HTML:
<?php
include('fontsize.inc.php');
?>
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Titel</title>
<link rel="stylesheet" type="text/css" href="fontsize.css.php" />
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="komplett">
<div id="left"><img src="pix/pix.gif" width="1" height="120" /></div>
<div id="main">
<div id="top">
<div align="right" class="txt_white" id="menu">
<a href="profil.php" class="txt_white">Profil</a> -
<a href="kunden.php" class="txt_white">Kunden</a> -
<a href="referenzen.php" class="txt_white">Referenzen</a> -
<a href="worxx.php" class="txt_white">Worxx</a> -
<a href="kontakt.php" class="txt_white">Kontakt</a>
</div>
<div>
<img src="pix/logo.gif" alt="logo" width="178" height="25" border="0"/>
</div>
</div>
<div class="txt_nav" id="flashmenu">
<div id="navmenu"><?php include('inc.flashnav.php');?></div>
</div>
<div class="txt" id="content">
<div class="txt" id="text" >
<h1>Impressum</h1>
<h2>Alles was Recht ist. </h2>
</br>
<div id="spalte">
<p>Text<br />
Text</p>
</div>
<div id="spalte">
<p>Text</p>
</div>
</br>
<p>Text </p>
<p>Text </p>
<p><Text </p>
</div>
</div>
<div class="txt_bottom" id="bottom"><?php include('inc.bottom.php');?></div>
</div>
<div id="right">
<div id="pfeil"> </div>
<div id="schrift" class="txt">
<?php include('inc.schrift.php');?>
</div>
<div id="unternav" class="txt">
</div>
</div>
</div>
</body>
</html>
Und der CSS-Code
Code:
/* CSS Document */
html, body {
height:100%;
margin:0;
/* overflow: hidden; */
}
#komplett {
position:absolute;
left:0;
top:0;
width: 100%;
height:550px;
margin: 75px 0 0 -50%;
/* margin: -275px 0 0 -397px; */
padding: 0px;
left: 50%;
}
#left {
width: 15%;
height: 100%;
float:left;
background-image: url(pix/pfeil_orange.gif);
background-position: right top;
background-repeat: no-repeat;
}
#main {
width: 65%;
padding: 0px;
float: left;
}
#right {
width: 20%;
float: left;
padding: 0px;
margin: 0px;
}
#schrift {
margin: 0px;
height: 65px;
text-align: left;
padding-top: 10px;
padding-right: 0;
padding-bottom: 0;
padding-left: 25px;
vertical-align: middle;
}
#unternav {
padding: 22px 0 0 25px;
margin: 0px;
height: 350px;
}
#pfeil {
height: 100px;
background-image: url(pix/pfeil_rechts.gif);
background-repeat: no-repeat;
background-position: left bottom;
}
#menu {
clear:left;
height: 40px;
}
#top {
padding: 0px;
margin: 0px;
background-image: url(pix/pfeil_oben.gif);
background-repeat: no-repeat;
background-position: right bottom;
height: 65px;
}
#flashmenu {
height: 105px;
background-color:#0086CB;
padding: 0px;
margin: 0px;
background-image: url(pix/bg.gif);
background-position: right;
}
#navmenu {
float: left;
width: 395px;
padding: 0px;
margin: 0px;
}
#rechts {
float: right;
width: 105px;
padding: 0px;
margin: 0px;
}
#content {
padding: 5px 0px;
clear:left;
}
#thumbs {
padding: 0px 20px;
}
#spalte {
float: left;
padding: 0px 0px 10px 0px;
width: 50%;
}
#text {
/*float: left;*/
padding: 5px 15px;
height: 350px;
}
#bottom {
clear:both;
padding: 0 5px 0 0;
margin: 0;
height: 15px;
text-align: right;
}
#pix {
float: left;
padding: 0px 15px 0px 0px;
}
#pix_klein {
float: right;
padding: 20px 0px 0px 20px;
width: 150px;
}
h1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1.2em;
font-weight: bold;
color: #004B99;
padding: 0px;
margin-top: 20px;
margin-right: 0;
margin-bottom: 0;
margin-left: 0;
}
h2 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 1em;
color: #0086CB;
padding: 0px;
margin: 0px;
font-weight: normal;
}
.txt {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 0.85em;
color: #004B99;
text-decoration: none;
}
Wäre Super, wenn jemand den Fehler finden würde...
Gruß
Eisenherz