|
|||
dynamische höhe bei box layout
habe folgendes problem: ich habe folgendes grund css layout
<div id="container> <div id="header> </div> <div id="content> <div id="list> liste mit dynamisch vielen einträgen </div> </div> <div id="footer> </div> </div> das problem ist, dass sich die höhe des containers nur dann ändert, wenn ich im content irgendwas reinschreibe, das nicht in einem weiteren div steht. schreibe ich also die liste direkt rein, kein problem, aber ich brauch das wieder in einer eigenen box. wie kann ich das im stylesheet den der content box sagen, dass die sich dynamisch an die höhe des inhalts anpasst? |
Sponsored Links |
|
|||
so schauts momentan aus
Code:
body{ color:#202020; background:#E5E5E5; } #container { position:absolute; width:780px; margin: 0px 0 0 -390px; top: 50px; left: 50%; background:url(../img/bg.gif) repeat-y; color:#000; } #header { position:relative; top: 0px; left: 0px; width:780px; height:120px; background:url(../img/header.gif) no-repeat; color:#000; text-align:right; line-height:15px; } #content { margin: 0px 30px 0px 30px; padding: 0px 0px 50px 0px; text-align: left; } #list_head { position: absolute; top: 280px; left: 35px; font:400 12px/20px "Lucida Grande","Nimbus Sans Medium",Arial,sans-serif; text-align:left; color:#202020; width: 146px; } #list{ position: absolute; top: 303px; padding:0px 0px 0px 10px; font:400 12px/20px "Lucida Grande","Nimbus Sans Medium",Arial,sans-serif; text-align:left; color:#202020; background:transparent; border-left:1px dotted #d3d3d3; width: 130px; left: 39px; } #footer { position:relative; bottom: 0px; left: 0px; margin:0px; padding:0px; width:780px; height:70px; background:url(../img/footer.gif) no-repeat; color:#000; } |
|
|||
Hi,
soll der Container mittig ausgerichtet sein? Sonst versuche folgendes: Code:
html,body { height: 100%; } Code:
#container { position:absolute; width:780px; height:100%; <-------------------------------- oder height:auto; <-------------------------------- eins von Beiden margin: 0px 0 0 -390px; top: 50px; left: 50%; background:url(../img/bg.gif) repeat-y; color:#000; }
__________________
Ein Gedanke... unendliche Verbindungen |
|
|||
das funktioniert leider auch nicht. Ich versteh das nicht ... wenn eine box keine fixe höhe hat und eine interne box mehr inhalt hat, dann müßte doch die äußere box 'ausgedehnt werden oder?
|
|
|||
habs mal schnell online gestellt
http://web26.mn-server.net/test/ das weiße is der container. ich habe ein paar reingeschmissen, damit der container ein bisschen gestreckt wird ... aber das kanns halt nicht sein. |
|
|||
ok, ich hatte mal ein ähnliches Problem (was nur def Ff verursachte) auf meiner ehemaligen Seite. Habe es dann so gelöst:
Code:
#container { position:absolute; height:auto; width: 798px; margin-left:-400px; left:50%; margin-top:1.0em; text-align:left; background:#EFE9C7; border:1px solid #4D1F22; color:#4D1F22; voice-family: "\"}\""; voice-family:inherit; width: 796px; } html>#container { width: 796px; }
__________________
Ein Gedanke... unendliche Verbindungen |
|
|||
Sorry, aber ich für meinen Teil habe leider noch icht verstanden, was sich jetzt an was anpassen soll; in deiner Ausgangsfrage hast du ein div #header und ein div #list, die dann aber in deiner Online-Version nicht mehr existieren...
Falls du aber wollen solltest, dass sich das div #container soweit ausdehnt, dass es den gesamten Inhalt umschließt, dann darfst du die darin enthaltenen einzelnen Elemente (von #words_head bis #rezeption) nicht absolut positionieren. Damit nimmst du diese aus dem normalen Fluss heraus und dann passt sich auch nix mehr an... Grüße fricca |
Sponsored Links |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Dynamische Höhe 100% und IE6 | hubspe | CSS | 11 | 01.07.2007 09:19 |
Dynamische Layout Breite und Höhe | altes-kind | CSS | 7 | 12.01.2007 12:54 |
layout problem mit höhe | Deude | CSS | 6 | 31.03.2005 22:00 |
#boxes a:hover.info: 2.posting mit css !!! | marioN | CSS | 5 | 25.01.2004 18:04 |
#box a:hover .info: css-layout: ie6.0/win, moz.1ie5.0/mac, | marioN | CSS | 2 | 19.01.2004 18:17 |