Antworten auf deine Fragen:
Neues Thema erstellen

DIV mit dynamischer Höhe

tymoe

graphicdrunkie

Hallo zusammen,
ich hab schon wieder ein problem mit css.

und zwar hab ich meine seite nun umgeschrieben und will einen content layer haben der sich dynamisch an die höhe des textes anpasst, bzw, sagen wir so, wenn der text größer ist als der div soll sich der div automatisch nach unten verlängern.

normalerweise dachte ich das passiert mit dem festlegen der minimalen höhe, tuts aber be mir nicht.

jemand ne idee?

HTML:
html, body {
	height: 100%;

}

#content	{
	width: 1000px;
	min-height:685px;
	background-image:url(images/layout/background-content.png);
	background-position: right bottom;
	background-repeat:no-repeat;
	z-index:1;
	border-top:none;
	border-left: 1px #cccccc dashed;
	border-bottom: 1px #cccccc dashed;
	border-right: 1px #cccccc dashed;
}

der content div befindet sich im center div der wie folgt aussieht:

HTML:
#center	{
	width: 1000px;
	position: absolute;
	left: 50%;
	margin-left: -512px;
	height:685px;
	

}

grüße
tymoe
 

Tattoomaus78

nemesis-artgroup.de

AW: DIV mit dynamischer Höhe

Code:
#center	{
	width: 1000px;
	position: absolute;
	left: 50%;
	margin-left: -512px;
	height:685px;
	

}

damit zentrierst du deine ganze Seite? wenn ja versuch es mal so:

Code:
#center	{
	width: 1000px;
	margin: 0 auto;
        min-height:685px;   /*wird übrigens nur von modernen Browsern gelesen...der IE macht hier zicken*/
}

ansonsten...lad das mal irgendwo hoch und poste den Link hier oder stelle den kompetten code ein
 
Zuletzt bearbeitet:

tymoe

graphicdrunkie

AW: DIV mit dynamischer Höhe

da zerschießt er das layout wenn ich das browser fenster höher mache
und der content div bleibt immer noch gleich, der text geht immer noch über die untere border.

grüße
tymoe
 

sokie

Mod | Web

AW: DIV mit dynamischer Höhe

schick mal einen link zur Seite, dann kann man sich das mal im ganzen ansehen.
es gibt ein paar dinge die schon an dem bisschen code zu sehen, die möglicherweise eine fehlerquelle sind.
deine absolut positionierten inhalte wirken sich nicht auf das elternelement aus, weil sie aus dem dokumentenfluss herausgenommen sind.
Besser ist da auf jeden fall, wie tatoomaus schreibt es beim relativen positionieren zu belassen, und auch so zu zentrieren, wie sie es beschreibt.
Dein html,body - height führt dazu, dass der Body das browserfenster ausfüllt. Inhalte, die darüber hinausgehen erzeugen einen overflow (der zwar optisch im browser 'irgendwie' gehandled wird) und führt nicht zur verlängerung des Elements (die höhe ist ja mit 100% festgelegt).
Soll sich Container und Seite mit dem Inhalt verlängern, keine Höhe angeben!
 

Herr_D

offline

AW: DIV mit dynamischer Höhe

Code:
html, body {
        height: 100%;
        text-align:center; /*zentrierung IE<7 */

}

#content        {
        width: 1000px;
        margin:auto;
        min-height:685px; /* Mindesthöhe moderne Browser */
        height:auto !important; /* hebt in modernen Browsern das height:685px auf */
        height:685px; /* Mindesthöhe IE<7 */
        background-image:url(images/layout/background-content.png);
        background-position: right bottom;
        background-repeat:no-repeat;
        z-index:1;
        border-top:none;
        border-left: 1px #cccccc dashed;
        border-bottom: 1px #cccccc dashed;
        border-right: 1px #cccccc dashed;
        text-align:left; /* hebt body center auf */
}


#center kannste dir dann schenken...


IE6 kann ich leider nicht testen...
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
118.614
Beiträge
1.538.351
Mitglieder
67.525
Neuestes Mitglied
mgtaucher
Oben