Bündige Positionierung von Blockelementen

[Biesterfeld]

Hej Leute,

hab zwei kleine css-Fragen. Erstmal mein konkretes Problem:
http://www.softandlazy.de/public mit zugehörigem css.

Ihr werdet rechts oben eine Listen-Navigation (id="navi") sehen, die in einem div (id="header") gepackt ist. Ich stell mich zu dämlich an diese Navigation unten bündig mit dem <div> abzuschließen, also so:

___________________________________________________
  |                                                   |
  |                   div id="header"                 |
  | Überschrift h1         ________________________   |
  |                       |      ul id="navi"      |  |
  |_______________________|_____|_____|_____|______|__|

Wer für mich nen Tip, gerne mit Erklärung hätte, wäre sehr dankbar.

Die zweite Sache ist ein grundlegendes Verständnisproblem: Ich habe das Problem damit gelöst, dass ich dem <h1> (ebenfalls innerhalb des header-<div>, welcher bündig links oben an den Fensterrand abschließt) ein margin:0; verpasst habe, aber: Ohne war es so gewesen, dass h1 einen Abstand des <div>'s zum Fensterrand erzeugte. Das versteh ich nicht, margin beschreibt doch den Abstand zum Elternelement, also hier der <div>. Wie kann dann ein Blockelement  innerhalb eines anderen die relative Position des umschließenden Elementes beeinflussen?

Vielen Dank schonmal für eure Hilfe,

Beste Grüße
Biesterfeld

[Biesterfeld]

Hej

hab zwei kleine css-Fragen. Erstmal mein konkretes Problem:
http://www.softandlazy.de/public mit zugehörigem link:http://www.softandlazy.de/public@title=css].

Das ist natürlich das css: link:http://www.softandlazy.de/publicstyle.css]

Sorry und beste Grüße
Biesterfeld

[Anonym weil peinlich]

So,

ich geh ins Bett, allerhöchste Zeit, grad noch das:

http://www.softandlazy.de/public/style.css

[Ingo Turski]

Hi,

zunächst mal fällt mir ein überzähliges </div> auf und Dein CSS läßt ahnen, daß Du Dich noch nicht lange damit beschäftigt hast. Ein Tip ist immer der Validator. Der zeigt Dir gleich so unsinnige Dinge wie:
margin-bottom:auto 0 0 auto;

Aber zum Header: height:17%; ist sehr ungünstig. Was hat die Bildschirmhöhe mit dem Platzbedarf des Inhaltes zu tun?
Um #navi nach unten zu setzen, mußt Du ihr eine sowie den LI-Elementen eine passene Höhe und ein passendes margin-top geben, wenn Du auf absolute Positionierung verzichten willst. Das ist freilich nicht ganz ohne Tücken, weshalb ich für #header ganz auf eine Höhenangabe verzichten würde.

Ich habe das Problem damit gelöst, dass ich dem <h1> (ebenfalls innerhalb des header-<div>, welcher bündig links oben an den Fensterrand abschließt) ein margin:0; verpasst habe

und warum hast Du das margin-top von H1 nicht einfach auf 0 gesetzt?

freundliche Grüße
Ingo