boxenhöhe abhängig von inhalt (inhalt ist relative positioniert)

[vangoo]

Hallo,

ich habe ein Problem mit dem Positionieren.

ich habe ein div-element mit diesen css codes:

.basic{
width:798px;
border-bottom:1px solid #ff6f10;
border-left:1px solid #ff6f10;
border-right:1px solid #ff6f10;
position:absolute;
top:150px;
font-family:Arial, Helvetica, sans-serif;
}

in diesem div befindet sich der Inhalt meiner Homepage. wenn ich den Inhalt nicht mit absolute oder relative positioniere verändert sich die Höhe dieser div Box im Verhältnis mit dem Inhalt mit.

Ich wollte den Inhalt allerdings um ca. 200px nach unten verschieben. Wenn ich das mache schießen die boxen, über die div Box mit dem oben genannten css Code, hinaus..

ich könnte zwar die die Höhe der umgebenden Box erhöhen. Dies würde mein Problem nicht beheben. Denn bei größerem Inhalt würde das Gleiche passieren

gibt es eine Möglichkeit, dass sich die umgebende box trotz positionierung des Inhaltes, an deren höhe anpasst?

bye vangoo

[Steel]

Hi,

Tut mir leid. Ich werd nicht ganz schlau aus deinem Post und bin mir nicht sicher, was genau dein Problem ist.

Du moechtest ein Div positionieren. Das sehe ich doch richtig?
Dieses Div ist mit anderen in einem umschlliessendem Div plaziert?
Wenn Du das besagtes Div verschiebst passiert was?

Hast Du mehr Code oder ein Beispiel online? Das waere hilfreich.

[vangoo]

hi,

hast recht ohne beispiel is es schwer.

http://freenet-homepage.de/vangoo/

Hier habe ich mal ein beispiel hochgeladen.

@charset "utf-8";
/* CSS Document */
.positioning_page{
margin:auto;
width:800px;
}
.header_pic{
width:798px;
position:absolute;
top:20px;
z-index:100;
}
.headtomenue{
position:absolute;
top:184px;
left:1px;
}
.basic{
width:798px;
border-bottom:1px solid #ff6f10;
border-left:1px solid #ff6f10;
border-right:1px solid #ff6f10;
position:absolute;
top:150px;
font-family:Arial, Helvetica, sans-serif;
}
.search{
position:relative;
left:580px;
top:12px;
}
.search_button{
position:relative;
top:4px;
}
.middle{
position:relative;
top:200px;
}
.menue_middle_category{
width:150px;
height:25px;
background-color:#3399FF;

}
.menue_middle_topic{
width:150px;
background-color:#FFFFFF;
}
.footer{
text-align:center;
border-top:1px solid #b3b3b3;
}

Das ist der komplette CSS code der Seite.
das menue befindet sich in der divbox mit der klasse middle.

die box welcher den orangen rahmen hat, hat die klasse basic.

wenn ich die middle box um 200px nach unten verschiebe passt sich die basic div nicht an. Was passiert sieht man ja da.

Wie könnte ich das lösen?

bye vangoo

[Detlef G.]

Hallo vangoo

ich habe ein Problem mit dem Positionieren.

in diesem div befindet sich der Inhalt meiner Homepage. wenn ich den Inhalt nicht mit absolute oder relative positioniere verändert sich die Höhe dieser div Box im Verhältnis mit dem Inhalt mit.

Positionierung ist nur in ganz bestimmten Fällen wirklich sinnvoll.

Bei absoluter Positionierung wird das Element praktisch aus der Seite einfernt (es hat keinen Einfluss mehr auf andere Elemente), und wird wie ein Aufkleber an der angegebenen Position drübergeklebt. Also, absolute Positionierung nur dort, wo dieser Effekt beabsichtigt ist!

Bei relativer Positionierung wird das Element verschoben und reserviert ganau den Platz, den es ohne Positionierung einnehmen würde.

Ich wollte den Inhalt allerdings um ca. 200px nach unten verschieben. Wenn ich das mache schießen die boxen, über die div Box mit dem oben genannten css Code, hinaus..

Du willst den Inhalt also nicht wirklich verschieben, sondern wohl eher einen oberen Abstand haben.

gibt es eine Möglichkeit, dass sich die umgebende box trotz positionierung des Inhaltes, an deren höhe anpasst?

Genau dafür ist (zumindest absolute) Positionierung _nicht_ vorgesehen.
(Zitat Nummer 87)

Auf Wiederlesen
Detlef