Autor |
Nachricht |
picnick
Threadersteller
Dabei seit: 24.10.2008
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Fr 24.10.2008 16:47
Titel 2 DIV's im DIV; Automatische Höhe |
|
|
Weiss leider langsam nimmer weiter...
ich möchte ein DIV, das 2 weitere DIV's enthält, und zwar zeilenweise.
------------------
HEADER
------------------
CONTENT
------------------
das besondere .. der HEADER soll variabel sein und CONTENT das container DIV ganz ausfüllen. Ist das überhaupt möglich? Mit Tabelle gehts ja zumindest im Firefox ..
|
|
|
|
|
pixelpapst303
Dabei seit: 06.07.2006
Ort: hamburg
Alter: 50
Geschlecht:
|
Verfasst Sa 25.10.2008 08:29
Titel
|
|
|
lass den container doch einfach 100% haben...
|
|
|
|
|
Anzeige
|
|
|
picnick
Threadersteller
Dabei seit: 24.10.2008
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Sa 25.10.2008 10:08
Titel
|
|
|
der container hat 100%. der header einmal 20px, einmal 100px. der content soll sich jeweils über den rest des containers erstrecken.
meine weitere überlegung war ne tabelle als positionierungshilfe zu verwenden; das problem hierbei ..
Code: |
<table>
<tr><td><div id="header"></div></td></tr>
<tr><td><div id="content"></div></td></tr>
</tr>
|
.. container-div und table ist css formtiert auf 100%, td fest auf 400px, wie auch der container.
wenn ich dem header ein div höhe 20px pixel geht, funktioniert das unter firefox gut, ie7 macht aus den 2 tabellen-reihen jedoch 2 gleich hohe
|
|
|
|
|
picnick
Threadersteller
Dabei seit: 24.10.2008
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Sa 25.10.2008 10:21
Titel
|
|
|
aehm .. nochmals experiementiert und selber auf die lösung gekommen
Code: |
<div style="height:200px;width:100px;background-color:#99CC99">
<div style="height:20px;width:100px;background-color:#FF0066;float:left">###HEAD###</div>
<div style="width:100px;background-color:#FFFF33;height:100%;">###MAIN###</div>
</div>
|
ändere ich jetzt die höhe des headers, passt sich das main automatisch dem container an .. hurra ..
|
|
|
|
|
status4
Dabei seit: 01.10.2008
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Sa 25.10.2008 10:21
Titel
|
|
|
picnick hat geschrieben: | der container hat 100%. der header einmal 20px, einmal 100px. der content soll sich jeweils über den rest des containers erstrecken. |
Was heißt #header soll einmal 20px und einmal 100px hoch sein?
picnick hat geschrieben: | Code: |
<table>
<tr><td><div id="header"></div></td></tr>
<tr><td><div id="content"></div></td></tr>
</tr>
|
|
Nein also so wirklich nicht.
Edit: Also doch so einfach, du hast dich etwas sehr unverständlich ausgedrückt.
Zuletzt bearbeitet von status4 am Sa 25.10.2008 10:22, insgesamt 1-mal bearbeitet
|
|
|
|
|
picnick
Threadersteller
Dabei seit: 24.10.2008
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Sa 25.10.2008 12:27
Titel
|
|
|
verzeih ..
leider zu früh gefreut .. firefox gut, ie wieder schlecht ..
mit folgendem Code:
Code: |
<div id="content_container" style="height:200px;width:100px;background-color:#99CC99">
<div id="content_head" style="height:60px;width:100px;background-color:#FF0066;float:left">###HEAD###</div>
<div id="content_border" style="width:100px;background-color:#999900;height:100%">
<div style="width:80px;background-color:#6666FF;height:240px;float:left">###MAIN###</div>
</div>
</div>
|
gibts folgendes Ergebnis ..
By picnick at 2008-10-25
dabei soll ja content_border brav das div auffüllen und main wenn grösser eben drüberschauen. ein overflow:hidden im container würde allerdings auch main beschneiden, auch mit position:absolute.
grübel .. grübel ..
Zuletzt bearbeitet von picnick am Sa 25.10.2008 12:38, insgesamt 1-mal bearbeitet
|
|
|
|
|
m
Moderator
Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht:
|
Verfasst Sa 25.10.2008 12:35
Titel
|
|
|
Ins blaue geraten, Google: "faux columns"
|
|
|
|
|
l3mon
Dabei seit: 26.07.2005
Ort: -5m
Alter: 58
Geschlecht:
|
Verfasst So 26.10.2008 09:19
Titel
|
|
|
m hat geschrieben: | Ins blaue geraten, Google: "faux columns" |
ich wußte, daß das kommen würde
was magst denn als ergebnis haben - wär hilfreich
|
|
|
|
|
|
|
|
Ähnliche Themen |
verschachtelete divs mit 100% Höhe
Höhe von 2 DIVs angleichen - wie?
gleiche höhe für divs?
Höhe definieren eines divs
CSS problem mit floatenden DIVS und der Höhe
Automatische Höhe [CSS] geht nit
|
|