[denz]

Hallo,

ich verzweifel hier gerade ein bisschen an einem Layout. Ich muss vorab sagen, dass ich kein Programmierer bin. Sprich, ich habe absolut keine Ahnung von PHP, kann CSS und HTML aber eigentlich relativ ausreichend.

Ich vermute ja, dass mein Problem so banal ist, dass es vermutlich auf der Hand liegt. Aber ich zerbreche mir seit Stunden den Kopf und komme einfach nicht weiter. Auch Google hat mir in diversen Anfragen nicht helfen können.

Es geht um folgendes:
Ich arbeite an einem Layout, bei dem Header, Footer und der Content per PHP aus externen Dateien inkludiert werden. Das klappt auch problemlos. Jetzt soll rechts neben dem inkludierten Contentbereich eine Art Sidebar erscheinen. Diese Sidebar hat zusammen mit dem Content in etwa die Breite des Headers. Die Sidebar bekomme ich sogar an die richtige Stelle gesetzt, allerdings rutscht der inkludierte Content, der ja eigentlich unmittelbar links daneben sitzen sollte, um die Höhe der Sidebar nach unten, so dass Content und Sidebar quasi leicht versetzt untereinander statt nebeneinander stehen.

Ich weiß wirklich nicht, was ich da noch tun kann. Ich habe sämtliche Positionierungen mit position:relative, z-index und Co. probiert. Nichts scheint zu helfen. Selbst divs um die inkludierten PHP-Files habe ich gesetzt. Damit (position:relative; top:-800;) konnte ich erreichen, dass der Content jetzt zwar wie gewünscht neben der Sidebar sitzt, allerdings addiert er die -800px scheinbar unten zwischen den Content und den Footer. Also auch keine Lösung.

Leider habe ich keinen Zugriff auf die inkludierten PHP-Files.

Hat da spontan jemand eine Idee?

Danke vorab!

[Kash]

Werden die inkludierten Inhalte (wrapper) gefloatet?

[denz]

Kann ich dir ehrlich gesagt nicht sagen. Ich floate sie nicht. Ich ersetze aber quasi mit meiner hard gecodedenden Sidebar eine dynamische, die ähnlich wie der Rest, per include geladen wird, bzw. geladen werden würde. Ich habe aber auch schon versucht die "neue" Sidebar mit float:right zu floaten. Dann hängt sie am rechten Rand des inkludierten Contents.

[Kash]

Hast Du denn keinen Zugriff auf die Daten?

Schau Dir doch mal den DOM an und sprich mittels CSS diese Elemente an.

[denz]

[michael2105]

Das Problem kann daran liegen, dass die Breite der Box für den Content + die Breite der Sidebar zusammen größer sind als die innere Breite des Headers. Das Problem an der Sache ist warscheinlich, dass man sich öfters mal, gerade wenn man Elemente anordnen möchte, den Rand der Boxen mit border: 1px solid; einblendet. Das Problem daran ist aber, das der Rand zur festgelegten Breite dazugerechnet wird.

ein kleines Beispiel:

Headerbreite: 800px - darunter eine Box 600px breit mit float:left; - daneben eine Box 200px breite mit floet:right;.

Passt alles wunderbar - solange man nicht border: 1px solid; bei einer der Boxen einschaltet. Sonst rutscht die nach unten weg, weil sie ja auch sonst nirgends hin kann

Der Header mit 800px Breite besitzt somit eine innere Breite von 800px. Die Box für den Content mit 600px ist aber bereits 602px breit, wenn man die Border einschaltet. Die Box für die Sidebar ist dann auch noch 202px breit sofern die Border an ist.


Kleiner Tipp:

Anstelle von Border: 1px solid besser background-color:#ff0000; während der Layoutphase nutzen solange man Elemente anordnet. Die werden dann nämlich nicht größer.


Gruß
Michael

[Kash]

[michael2105]

hm... vielleicht mal overflow:hidden; in die div-Container schreiben und schauen was dann passiert.
Vielleicht hat auch die Sidebar clear:right; als Eigenschaft mitbekommen.

Echt eine knifflige Sache wenn man nicht in den Code schauen kann.


Gruß
Michael