Elemente floaten nicht richtig. <main> zu kurz für Inhalt

    Hallo Forumsfreunde,
    jetzt habe ich ein "Anfänger"problem, dass ich aber nicht lösen kann.

    Ich habe versucht mein CMS auf html5-Elemente umzustellen.
    Im Versuch und bei den meisten Seiten ging's gut:
    http://www.jsr-hersbruck.de/site/fam/index.html

    In der Praxis hat main bei manchen Seiten nicht die ausreichende Höhe der Elemente innerhalb, so dass Text verschluckt wird. Des weiteren sortiert sich der Footer nicht unter main, sondern hängt sich rechts an.
    http://www.jsr-hersbruck.de/site/fam/index_verschoben.html

    Mit einem clear:left; könnte ich den Footer links positionieren, main würde den Text dann als overflow zeigen, hätte aber trotzdem keinen Hintergund im überstehenden Abschnitt.

    Vielen Dank im Voraus

    Nachtrag:
    eine besonders schlimme Seite:
    http://www.jsr-hersbruck.de/site/was/index.html
    Die Überschriften h3 sind nichtan ihren passenden Stellen, sondern direkt untereinander. Wie kannso etwas passieren?

    Einmal editiert, zuletzt von resteverwerter (19. September 2013 um 05:53)

    Das Problem der #main, die nicht richtig skaliert, kanst du mit einem overflow: hidden; lösen.

    Was die Paragraphen angeht, verstehe ich nicht, warum du denen überhaupt ein float verpasst hast. Ich hab mal die floats für article p entfernt, das sieht für mich ganz okay aus, ist aber möglich, dass das irgendwo sonst Probleme gibt, von hier aus schwer zu sagen.

    Was dein HTML-Markup angeht denke ich allerdings, dass du da noch etwas daran arbeiten könntest. Auf der letzten Seite die du verlinkt hast sieht es so aus, als sollte jede h3,p,img kombination als eine zusammengehörige Einheit dastehen, da bietet sich eigentlich jeweils ein <section> tag an, um die drei zusammen zu halten.


    Gruss,
    -Lukas

    Vielen Dank,

    Problem 1 -gelöst
    main ist nicht hoch genug - overflow:hidden funktioniert.
    Weiß irgendjemand warum das so ist?

    Problem 2: - gelöst
    float für p - keine Ahnung, warum. Auch die width ist überflüssig, da dies ja durch section definiert ist. -> lösch ich raus!

    Das klingt jetzt wohl komisch, aber irgendwie ist meine Homepage und das css (wie ein Krebsgeschwür) organisch in alle Richtungen gewachsen. Gerade am Anfang (d.h. auf älteren Seiten) gab es eine Vielzahl von div-Boxen, die ich heute in den normalen Fließtext einbauen würde. Jetzt will ich da endlich mal Stück für Stück wieder Struktur reinbringen und Du hast mir da sehr geholfen.

    Das html-markup dieser Seite war für mich nur ein Beispiel der Darstellungsprobleme. Anders als OnePage-Webseiten muss ich irgendwie immer unter dem rollenden Rad arbeiten. Im offline-Modus hatte meine Beispielseite funktioniert und online dann die zu kurzen main-Container.

    Nochmals vielen Dank Matthias

    Einmal editiert, zuletzt von resteverwerter (19. September 2013 um 14:02)