Autor |
Nachricht |
mariokrupik
Threadersteller
Dabei seit: 06.02.2009
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mi 28.07.2010 16:14
Titel Probleme mit Layout - div im layout height="100%" |
|
|
Nun bin ich schon stunden dabei, mein Template ein bisschen zu verändern, und komme aber bei einem Problem nicht drumherum.
Und zwar gibt es bereits einige tutorials ein div mit der höhe von 100% anzulegen, jedoch beziehen sich diese alle auf ein wrapper element direkt unter dem Body Tag.
Bei mir sind es aber 2 Div im Wrapper, left floated, - links Navigation - rechts Content
Wie schaffe ich es, dass die linke navigationsleiste die selbe höhe erreicht wie die des Contents?
Hier ein Beispielcode: (oder hier)
Code: |
<!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" xml:lang="de-de" lang="de-de" >
<head>
<meta name="title" content="Testseite für Height 100%" />
<style type="text/css">
body {height:100%;}
#wrapper {width: 950px; margin:0 auto; border: 1px solid #ccc; padding:0; }
#wrapper td, #wrapper tr {margin:0; padding:0; }
#top {width: 900px; position:relative; left:25px; height:60px; background-color:#ffff99;}
#center-outer {width:850; margin: 10px 0 0 50px; background-color:#ccffff; height:100%; }
#center-left {width:400px; float:left; background-color:#cc00cc; height:100%; min-height: 100%; height:auto !important; overflow: hidden !important;}
#center-right {width:450px; float:left;background-color:#3333cc; }
</style>
</head>
<body>
<table id="wrapper"><tr><td>
<div id="top">top</div>
<div id="center-outer">
<div id="center-left">center left</div>
<div id="center-right">center right <br /> asdf<br /> asdf<br /> asdf<br /> asdf<br /> asdf<br /></div>
</div>
</table></tr></td>
</body>
</html>
|
Schonmal vielen Dank für jede hilfe.
|
|
|
|
|
Kash
Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht:
|
|
|
|
|
Anzeige
|
|
|
mariokrupik
Threadersteller
Dabei seit: 06.02.2009
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Mi 28.07.2010 16:38
Titel
|
|
|
vielen dank,
habs auch schon mit tabellen versucht, aber aufgrund meines aufwendig verschachtelten Layouts entweder extrem aufwendig (neugestaltung) oder auch nicht möglich.
hab jetzt noch diesen blog gefunden
http://www.ejeliot.com/blog/61
vielleicht klappts ja mit padding und negative bottom margin.
melde mich dann wieder.
|
|
|
|
|
Kash
Dabei seit: 07.11.2002
Ort: Schopfheim
Alter: 41
Geschlecht:
|
Verfasst Mi 28.07.2010 16:46
Titel
|
|
|
Nur bei deaktiviertem JavaScript funktioniert es nicht.
Zeig mal Dein Layout, dann kann ich Dir heute Abend (falls es passen sollte) ein Bsp mit der Borderlösung posten.
|
|
|
|
|
heiko_rs
Dabei seit: 06.02.2008
Ort: Berlin
Alter: -
Geschlecht:
|
Verfasst Mi 28.07.2010 17:40
Titel
|
|
|
mariokrupik hat geschrieben: | vielleicht klappts ja mit padding und negative bottom margin. |
Warum klappt es Deiner Meinung nach nicht mit faux columns? Dein Layout verwendet ausschl. px-Breiten, dem hast Du schneller faux columns verpasst, als Dein div-Layout in Tabellen nachgebaut (was eh ein No-Go wäre) oder Spatzen mit der Equal-Height-Columns-Kanone beschossen
Zuletzt bearbeitet von heiko_rs am Mi 28.07.2010 17:42, insgesamt 2-mal bearbeitet
|
|
|
|
|
|
|
|
Ähnliche Themen |
CSS - Layout height Problem
Website mit festen Layout in dynamisches Layout umbauen
Probleme bei Layout
Probleme mit [CSS] Layout
Layout Probleme
Probleme mit Layout Positionierung
|
|