docMario: H1-Border überlappt mit floating DIV

Hallo allerseits,
mich treibt ein Problem bald zum Wahnsinn! Leider habe ich keine gescheite Lösung im Internet gefunden. Darum hoffe ich auf Eure Hilfe!

Hier meine Frage:
für meine mediawiki-Implementation habe ich Überschriften mit border-bottom:1px solid black; einen Rahmen verpasst.
Wenn ich nun neben dem eigentlichen Fließtext noch ein DIV mit float:right; freistellen möchte, überlapen aber die Rahmen der Überschriften mit diesem DIV :(

Egal, was ich noch an Eigenschaften für das DIV oder H1 ergänze, die hässliche Überlappung bleibt... probiert habe ich beispielsweise:
 - border:1em solid white; und background:white; für das div
 - z-index: 100; für das div und z-index:1; für die Überschrift
 - diverse Werte für clear, margin und padding
 - display: inline / block / block-inline etc.

jetzt bin ich mit meinem Latein am Ende.
Bei den normalen mediawiki-Skins (z.B. Vector-Skin ) ist dieses Problem offenbar gelöst, ohne dass ich dahinter komme, wie genau :(

Herzliche Grüße, docMario

  1. Om nah hoo pez nyeetz, docMario!

    jetzt bin ich mit meinem Latein am Ende.

    Ich weiß leider nicht, was überlauf auf latein heißt.

    ("float-boxen einschließen" im schon oft verlinkten Spaltenlayoutartikel)

    Matthias

    --
    1/z ist kein Blatt Papier. http://www.billiger-im-urlaub.de/kreis_sw.gif
    1. ("float-boxen einschließen" im schon oft verlinkten Spaltenlayoutartikel)

      Danke, leider führten die Tipps im erwähnten Artikel auch nicht zum Erfolg. Ich habe nun sämtliche Permutationen von overflow für div und h1 durchprobiert.

      Hier noch mal zur Verdeutlichung, wie ich mir das Verhalten von H1 und DIV vorstelle:

      ÜBERSCHRIFT                    ##########
       -----------------------------  ##########
       lorem ipsum bla bla bla bla    ### DIV ##
       lorem ipsum bla bla bla bla    ##########
       lorem ipsum bla bla bla bla    ##########
                                      ##########
       ÜBERSCHRIFT 2
       -----------------------------------------
       lorem ipsum bla bla bla bla lorem ipsum

      und so sieht es jetzt aus:

      ÜBERSCHRIFT                     ##########
       ------------------------------------------
       lorem ipsum bla bla bla bla     ### DIV ##
       lorem ipsum bla bla bla bla     ##########
       etc.

      1. @@docMario:

        nuqneH

        Danke, leider führten die Tipps im erwähnten Artikel auch nicht zum Erfolg.

        Du machst etwas falsch.

        Zum Bespiel, die Tips für Fragende nicht zu beachten.

        Qapla'

        --
        Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
        (Mark Twain)
        1. Du machst etwas falsch.
          Zum Bespiel, die Tips für Fragende nicht zu beachten.

          Zum Beispiel welche Tips habe ich mißachtet? Kläre mich bitte auf, damit ich es in Zukunft besser machen kann. Danke im Voraus.

          LG, docMario

          1. @@docMario:

            nuqneH

            Du machst etwas falsch.
            Zum Bespiel, die Tips für Fragende nicht zu beachten.

            Zum Beispiel welche Tips habe ich mißachtet?

            Die für Fragende – in der Charta, die du wiederholt bestätigt hast gelesen zu haben.

            Qapla'

            --
            Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
            (Mark Twain)
            1. @@docMario:

              nuqneH

              Du machst etwas falsch.
              Zum Bespiel, die Tips für Fragende nicht zu beachten.

              Zum Beispiel welche Tips habe ich mißachtet?

              Die für Fragende – in der Charta, die du wiederholt bestätigt hast gelesen zu haben.

              Qapla'

              Danke für den IMHO unpassend süffisanten Hinweis. Die Tipps für Fragende habe ich gelesen und so gut ich konnte befolgt: Ich habe verständlich dargestellt, was mein Problem ist. Ich habe den problematischen CSS-Code angegeben und meine bisherigen Lösungsversuche dargestellt.

              Auszugsweise möchte ich für Dich gerne die "Tipps für Antwortende" aus der Charta mal zitieren:
              * Nicht jeder Fragende besitzt das technische Grundwissen [..] Du solltest Dich in Deiner Antwort dem Niveau des Fragenden anpassen.
              * Zu generelle Antworten helfen niemanden weiter. Antwortpostings der Art "Lies Dir erstmal das Kapitel CSS durch" oder "Die Antwort auf Deine Frage findest Du im Archiv" sind zu vermeiden.
              * Der sogenannte nüchterne, technische Tonfall in Fachforen wird von Neulingen und Außenseitern oft als unhöflich oder arrogant empfunden
              * nicht gern gesehen ist das nervige Gebaren von selbsternannten Forumspolizisten

              Ganz davon abgesehen halte ich diese Metadiskussion nicht wirklich für zielführend. Ich schlage daher vor, sie hiermit zu beenden.

              MfG, docMario

              1. @@docMario:

                nuqneH

                Danke für den IMHO unpassend süffisanten Hinweis.

                Die Bewertung, ob mein Hinweis süffisant war, überlasse ich gerne dir.
                Die Bewertung, ob mein Hinweis unpassend war, überlässt du bitte anderen.

                Hältst du ein ein paar Zeilen CSS ohne das zugehörige Markup für relanten Code?
                Hast du deine problematische Seite verlinkt?

                Qapla'

                --
                Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
                (Mark Twain)
              2. Hi,

                * Nicht jeder Fragende besitzt das technische Grundwissen [..] Du solltest Dich in Deiner Antwort dem Niveau des Fragenden anpassen.

                Zu tief Bücken schlecht für Rücken.

                MfG ChrisB

                --
                RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?
    2. Om nah hoo pez nyeetz, docMario!

      jetzt bin ich mit meinem Latein am Ende.

      Ich weiß leider nicht, was überlauf auf latein heißt.

      ("float-boxen einschließen" im schon oft verlinkten Spaltenlayoutartikel)

      Matthias

      Ah, ich habe es doch mithilfe Deines Tipps gelöst!!
      Und zwar musste ich dem beiden Elementen übergeordneten Container-DIV eine overflow Eigenschaft zuordnen!

      Danke!!

      Gruss, docMario