Positionierung einer Box mit relativer Breite

[didb]

Nabend

Kann man ein Kindelement zu einem gefloateten Element relativ zu diesem Elternelement positionieren?

Link zur Seite: http://menschenbilder.bplaced.net/start/index_bio.html

Ich habe vor, dass das Mädel immer unten links platziert bleibt und das Logo oben links. Das funktioniert soweit schon einmal super.

Dann soll jedoch der Kasten, in dem sich die Überschrift (und später einmal der gesamte Fließtext der Seite) befindet, rechts ausgerichtet werden und von der Größe so dargestellt werden, dass die Höhe 100% des Fensters bestimmt und die Breite sich vom rechten Rand bis zum Bild des Mädchen zieht.

Jemand eine Idee wie man das so verwirklichen könnte?

Wie es in etwa aussehen sollte, habe ich in einem JPG angehängt. Falls etwas unklar ist, erklär ich es gerne noch einmal in etwas anderen Worten.

Link zum Bild: http://img80.imageshack.us/img80/7732/unterseitev.jpg

Gruesse

 

[Maik]

Moin,

so lautet die Regel für #wrapper, damit der Block die verfügbare Breite zwischen #left_wrapper und dem rechten Fensterrand ausfüllt:

#wrapper {
                        margin-left:25%; /* umfliesst #left_wrapper mit dessen Breitenangabe */
                        height: 100%;
                        padding: 25px;
                }

Damit sich die Blockhöhe bis zum unteren Fensterrand erstreckt, ist diese Regelergänzung erforderlich:

* {
                       margin:0;
                       padding:0;
                }
html,body {
                        height:100%;
                }

Und damit die rechte Box wegen dem Box-Modell nicht über den unteren Fensterrand hinaus gestreckt wird, lauten die korrigierten Regeln für #wrapper und #content so:

#wrapper {
                        margin-left:25%;
                        height: 100%;
                        background-color: #8537B5;

                }
#content {
                        padding: 25px;
                }

Übrigens darf gemäß deiner Dokumenttyp-Deklaration in einem Inline-Element (= <a>) kein Block-Element (= <div>) enthalten sein - siehe hierzu auch http://de.selfhtml.org/html/referenz/elemente.htm#inline_elemente.

mfg Maik

 

[didb]

Habe den Quelltext abgeändert. Dadurch, dass das Bild im #left-wrapper jedoch absolut am unteren Bildschirmrand positioniert ist, bleibt der #wrapper nicht am rechten Bildrand "stehen".

 

[Maik]

Wenn ich "am rechten Bildrand stehen" richtig interpretiere, tauscht du in deinem CSS besser alle 25%-Angaben gegen 375px aus - das entspricht der Bildbreite von "typin_bio.png" ;-)

mfg Maik

 

[didb]

Wenn ich "am rechten Bildrand stehen" richtig interpretiere, tauscht du in deinem CSS besser alle 25%-Angaben gegen 375px aus - das entspricht der Bildbreite von "typin_bio.png" ;-)

mfg Maik

Super. Danke. Das hätte natürlich auch funktioniert. Ich hatte den "geistreichen" Einfall, einfach anstatt das Bild als Hintergrund per CSS einzufügen, es einfach im body-Teil zu platzieren.

 

[Maik]

Super. Danke. Das hätte natürlich auch funktioniert. Ich hatte den "geistreichen" Einfall, einfach anstatt das Bild als Hintergrund per CSS einzufügen, es einfach im body-Teil zu platzieren.

Geht auch, sloange du es nicht bei besagten 25%-Werten belässt ;-)

mfg Maik