Problem mit Div-Design

Status
Nicht offen für weitere Antworten.

benninet

Mitglied
Ich arbeite im Moment an einer Webseite die ich komplett mit div-Layern aufbaue. Auch zum ersten mal in XHTML strict. Zuvor habe ich immer mit Tabellen gearbeitet, das hier hat aber durchaus seien Vorteile.

Nun zu meinem Problem: Ich habe Links eine Art Menü-Spalte mit height: 100% unf float:left;
Daneben dann denn Inhalt. Wenn jetzt der Inhalt so lang ist das man scrollen muss, passiert folgendes:

http://myBlackbox.net/div.jpg

Bitte habt Verständniss für die Zensur, die Sache ist noch nicht offiziell und nicht öffentlich.

Solltet ihr irgendwelchen Code oder die Stylesheets brauchen, kann ich sie natürlich auch posten.

Ansonsten Danke für eure Hilfe
 
OK, 1x das template das von PHP verabeitet wird:

HTML:
<!DOCTYPE html
     PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <title>{!!title!!}</title>
    <link href="style.css" rel="stylesheet" type="text/css" />
    <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
</head>
<body>
	<div id="links">
		<img src="images/bildstock.png" alt="Bildstock"/><br /><br />
{!!buttons!!}
	</div>
	<div id="gr_mitte">
		<div id="oben"><img src="images/oben-logo.png" /></div>
		<div id="mitte">
			{!!content!!}
		</div>
	</div>
</body>
</html>

und einmal die style.css

Code:
html, body
{
height: 100%;
margin: 0;
padding: 0;
background-color: #E1EFFE;
font-family: sans-serif;
}

#links {
position: relative;
float: left;
width: 148px;
height: 100%;
background-color: #81C9F3;
}

#gr_mitte {
height: 100%;
}

#oben {
height: 73px;
background-image: url(images/oben-klein.png);
text-align: right;
font-size: 0;
}

#mitte {
position: absolute;
margin: 20px 40px 20px 40px;
left: 146px;
color: darkblue;
font-size: 14px;

}

.ueberschrift {
font-size: 20px;
font-weight: bold;
border-bottom: 3px solid darkblue;
}

p {
background-color: #D0DEED;
padding: 5px;
}

img.txtimg {
float: left;
margin: 0px 5px 0px 0px;
}
 
Danke erst einmal, den wesentlichen unterschied den ich jetzt gesehen habe ist, dass stat height min-height verwendet wurde... ändert aber auch nichts dran... background-repeat ist für mich uninteressant, da ich ja kein background-image verwende...

EDIT:

Auch
height: auto !important;
height: 100%;
hat nichts gebracht
 
Zuletzt bearbeitet:
dann bleibt wohl nur noch die unschöne lösung ein 1x1px hintergrund bild in passender farbe zu fertigen :rolleyes:

naja, solang es funktioniert... danke
 
Ich würde die Grafik der linken Spaltenbreite entsprechend dimensionieren (148*1px) und als vertikales Hintergrundbild für das body-Element einsetzen, womit die deklarierte Hintergrundfarbe für die linken Spalte entfällt - fertig. ;)

Und wie eben schon in einem anderen Thread darauf hingewiesen, möchte ich dich auch hier darum bitten, auf die Groß- und Kleinschreibung zu achten.
 

Anhänge

  • leftCol.png
    leftCol.png
    147 Bytes · Aufrufe: 11
Entschuldigung für meine Rechtschreibung, ich gebe mir Mühe ;)

Zum Problem: So hab ichs auch gemacht, allerdings funktioniert es immer noch nicht. Alles ist so wie vorher :confused:
 
Status
Nicht offen für weitere Antworten.
Zurück