Border eines Bereiches bis nach unten ziehen

Hallo an alle!

Ich bastle gerade an meiner Webseite herum:
http://ud05_188.ud05.udmedia.de/web/

Nun habe ich das Problem, dass links die Navigation erscheinen soll und die weiße Linie soll bis nach ganz unten gezogen werden (bis zum Footer-Bereich). Leider geschieht dies nicht und der Content-Bereich ragt in die linke Navigationsseite hinein.

Hat jemand eine Idee was ich im CSS ändern muss?
CSS: http://ud05_188.ud05.udmedia.de/web/css/style.css

Gruß Phantom

Hallo,

Ich muss leider sagen das ich mit dem nicht zufrieden bin.

http://ud05_188.ud05.udmedia.de/web/

Ich würde dir empfehlen auf umzusteigen, dort kannst du eine bessere Navigation erreichen.
Bsp.: http://dragonk1988.kilu.de/ (Ist meine Seite)
schau dir hier den Quelltext doch einfach mal an

Ich kann dir auch bei dem Quellcode helfen.

Mfg Dragonk

Tabellen nehme ich nicht zum Layouten.
Hallo!

Danke für die Antwort, aber die div bleiben. Ich mache nichts mehr mit Tabellen bzgl. Layout. Tabellen nur dann wenn ich tabellarischen Inhalt darstellen will. Wie das mit Tabellen geht, ist mir auch klar, aber davon habe ich mich entfernt.

Gruß Phantom

1 Like

Hallo,

Nun also deine Einstellung versteh ich zwar nich aber
du müsstest glaube bei dem „Content“ noch „Border-left“
einfügen, dann müsste es gehen.
Zumindest beim Firefox, wie das beim IE aussehen muss kann ich dir nicht sagen.

mfg Dragonk

Nein, das border-left beim Content bewirkt nicht, dass der Content bündig mit der Navigation abschließt.
Es müsste eher in Richtung einem clear gehen, aber leider wirkt das nicht wie von mir gedacht.

Gruß Phantom

[Bei dieser Antwort wurde das Vollzitat nachträglich automatisiert entfernt]

Hai, Phantom,

ungeprüft: versuch mal, dem content ein float:right zu verpassen

Gruß
Sibylle

Hallo Fabian,

gib div#content einen margin-left von 200px und einen border-left von 2px solid white sowie div#left einen border-top von 2px solid white.

Schönen Gruß
Rudy

Hallo Rudy,

vielen Dank für deine Antwort. Muss ich also doch ein margin bzw. ein padding machen. Habe auch die weißen Linien mal etwas „optimiert“, dass ich diese nicht mehr überall stehen habe.

Jetzt siehts gut aus (http://ud05_188.ud05.udmedia.de/web/).
Hast Du vielleicht schon Anmerkungen was ich bisher verbessern könnte bzgl. HTML/CSS oder vom Design/Farbe her?

Gruß Phantom

[Bei dieser Antwort wurde das Vollzitat nachträglich automatisiert entfernt]

Rudy’s-Variante hat funktioniert. Mittels margin bzw. padding wird es einfach um die Breite von #left nach rechts verschoben.

Danke + Gruß Phantom

[Bei dieser Antwort wurde das Vollzitat nachträglich automatisiert entfernt]

Ich habe doch noch ein Problem:
Wenn ich ein padding auf #left setze, dann verschiebt sich der #content nach rechts rüber, jedoch nur auf der Höhe in der auch die Navigation sitzt, siehe: http://ud05_188.ud05.udmedia.de/web/

Was kann ich dagegen tun?

Gruß Phantom

[Bei dieser Antwort wurde das Vollzitat nachträglich automatisiert entfernt]

Hi,

Ich habe doch noch ein Problem:
Wenn ich ein padding auf #left setze, dann verschiebt sich der
#content nach rechts rüber, jedoch nur auf der Höhe in der
auch die Navigation sitzt, siehe:
http://ud05_188.ud05.udmedia.de/web/

Ich hab gesehen, Du hast nun eine max-width gesetzt, wofür ist die? Ich verwende max/min-widths nur bei liquid-layouts, nicht bei solchen mit fixer Breite. Wenn Du die rausnimmst und den margin-left von #content wie geschrieben auf 200px setzt (und nicht 180px) steht die Navigation auch nicht mehr in den Inhalt von div#content hinein und bricht diesen nicht um (da #content nicht selbst links floatet überlappt #left sonst den Inhalt von #content und dieser versucht #left zu umfließen). div#left ist 180px breit und hat 10px padding, d.h. es ist real 200px breit.

Was Du verbessern könntest… der Code ist ja nichts besonderes und die Website selbst sieht nach einem Versuch aus, darüber ein Urteil zu bilden wäre vermessen :smile: Hast Du überhaupt ein Layout entworfen? Wie auch immer, ich würde raten, Klassen und IDs so zu vergeben, dass sie nichts über das Layout aussagen, sondern über den Inhalt. Da Inhalt und Layout getrennt sind hat der Name ‚left‘ keinen Sinn, in null komma Josef ist die Navigation rechts wenn Du willst, und ist dann #left plötzlich rechts? ‚navigation‘ oder ‚menu‘ beschreibt den Inhalt und wäre für dieses div immer gültig. Du vergibst ja auch keine Klassen mit den Namen „blue“ oder „white“… Das CSS hab ich gar nicht so genau angeschaut, ich habe nur mit Firebug reingehackt, würde ich Dir auch raten, ist zum Testen super.

Ciao
Rudy

Hallo!

Ich hab gesehen, Du hast nun eine max-width gesetzt, wofür ist
die? Ich verwende max/min-widths nur bei liquid-layouts, nicht
bei solchen mit fixer Breite. Wenn Du die rausnimmst und den
margin-left von #content wie geschrieben auf 200px setzt (und
nicht 180px) steht die Navigation auch nicht mehr in den
Inhalt von div#content hinein und bricht diesen nicht um (da
#content nicht selbst links floatet überlappt #left sonst den
Inhalt von #content und dieser versucht #left zu umfließen).
div#left ist 180px breit und hat 10px padding, d.h. es ist
real 200px breit.

Achso, okay. Jetzt passt es. Das min/max-width ist schon wieder rausgenommen, da habe ich nur kurz etwas getestet.

Was Du verbessern könntest… der Code ist ja nichts
besonderes und die Website selbst sieht nach einem Versuch
aus, darüber ein Urteil zu bilden wäre vermessen :smile: Hast Du
überhaupt ein Layout entworfen? Wie auch immer, ich würde
raten, Klassen und IDs so zu vergeben, dass sie nichts über
das Layout aussagen, sondern über den Inhalt. Da Inhalt und
Layout getrennt sind hat der Name ‚left‘ keinen Sinn, in null
komma Josef ist die Navigation rechts wenn Du willst, und ist
dann #left plötzlich rechts? ‚navigation‘ oder ‚menu‘
beschreibt den Inhalt und wäre für dieses div immer gültig. Du
vergibst ja auch keine Klassen mit den Namen „blue“ oder
„white“… Das CSS hab ich gar nicht so genau angeschaut, ich
habe nur mit Firebug reingehackt, würde ich Dir auch raten,
ist zum Testen super.

Ja, das Bewerten der Webseite ist noch ein wenig früh. Ich bastle mal noch ein wenig weiter. Stimmt, die id-Namen sollte ich sinnvoller benennen. Wird gleich gemacht…
Mein Layout ist mir grundlegend vor Augen. Aber das ändert sich immer wieder, weil ich wieder woanders was Schönes sehe und das dann wieder einbaue und so wächst das nach und nach…

Danke + Gruß Phantom