Jean Pascal: float nicht aufgehoben, wenn in Blockelement?

Hallo,

mich würde mal interessieren: Wenn ich ein floatendes Element einschließe in ein Blockelement, sollte dann nicht eigentlich nach dem Blockelement ein Umbruch entstehen, oder ist das anders definiert?

Bei mir floatet ein auf das Blockelement folgendes DIV trotzdem noch, d.h. ich muss es mit clear versehen.

Danke, Jean

  1. Hi,

    mich würde mal interessieren: Wenn ich ein floatendes Element einschließe in ein Blockelement, sollte dann nicht eigentlich nach dem Blockelement ein Umbruch entstehen,

    nach dem Blockelement, in dem das gefloatete Element (bei welchem es sich übrigens ebenfalls um ein Blockelement handelt) ist, _ist_ ein Umbruch. Das gefloatete Element ragt u.U. heraus.

    Bei mir floatet ein auf das Blockelement folgendes DIV trotzdem noch, d.h. ich muss es mit clear versehen.

    Nein, das gefloatete Element floatet. Jedweder Text wird drum herum fließen; für das Box-Model selbst glänzt das gefloatete Element durch Nichtexistenz.

    Cheatah

    --
    X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
    1. Hi Cheatah,

      long time no hear!
      Back from Hel^Wholiday?  ;-)

      So long,

      Martin

      --
      Heutzutage gilt ein Mann schon dann als Gentleman, wenn er wenigstens die Zigarette aus dem Mund nimmt, bevor er eine Frau küsst.
        (Barbra Streisand, US-Schauspielerin)
      1. Hi,

        long time no hear!

        ach was, gerade mal 'ne gute Woche. Wie viel ist das in Internet-Jahren? ;-)

        Back from Hel^Wholiday?  ;-)

        Nope, ich nutze nur gerade 'ne Gelegenheit. In ein paar Tagen bin ich wieder Vollzeit dabei.

        Cheatah

        --
        X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
        X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
        X-Will-Answer-Email: No
        X-Please-Search-Archive-First: Absolutely Yes
    2. Hallo Cheatah,

      danke für deine Antwort.

      Entweder ich verstehe noch nicht, was du mir erklären willst, oder wir haben aneinander vorbei geredet. Ich habe hier mal zum besseren Verständnis einen Quelltext. Meine Frage: Eigentlich sollte doch - wie du geschrieben hast - div.menue einen Umbruch erzeugen (da Blockelement), so dass p unter dem Menü beginnt, richtig? Derzeit floatet es aber neben dem Menü. Außer wenn ich clear in das p einfüge.

      <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
        "http://www.w3.org/TR/html4/strict.dtd"><html>

      <html>

      <head>
      <style type="text/css">

      a.menue {
       width: 5em;
       height: 5em;
       display: block;
       float: left;
       border: 3px solid #000000;
       }

      div.menue {
       width:55em;
       }

      p.content {
       background-color: #EEEEEE;

      }

      </style>

      </head>

      <body>

      <div class="menue">
      <a href="test1.htm" class="menue">Test</a>
      <a href="test2.htm" class="menue">Test</a>
      </div>

      <p class="content">Lorem ipsum dolor sit amet.</p>

      </body>

      </html>

      Gruß Jean

      1. Hi,

        Entweder ich verstehe noch nicht, was du mir erklären willst, oder wir haben aneinander vorbei geredet. Ich habe hier mal zum besseren Verständnis einen Quelltext. Meine Frage: Eigentlich sollte doch - wie du geschrieben hast - div.menue einen Umbruch erzeugen (da Blockelement), so dass p unter dem Menü beginnt, richtig?

        das <p> beginnt unter dem <div class="menue"> (welches übrigens ein <ul> sein sollte). Die Links in diesem <div> ragen aber aus ihm heraus, so dass die Inhalte(!) des <p> darum herum fließen. Nutze die Macht des border.

        a.menue {

        Wozu haben die Links eigentlich eine Klasse? Gibt es innerhalb des <div class="menue"> noch Links, die nicht zum Menü gehören?

        display: block;
        float: left;

        Für den IE solltest Du in dieser Konstellation display auf inline setzen. Das hat exakt die selbe Wirkung, umgeht aber einen der vielen IE-Bugs.

        Cheatah

        --
        X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
        X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
        X-Will-Answer-Email: No
        X-Please-Search-Archive-First: Absolutely Yes
        1. Aaaaaaah, jetzt!

          Danke, für diese Erleuchtung. Ich war die ganze Zeit davon ausgegangen die Höhe des DIV richte sich nach dem Inhalt, sprich den fest definierten <a>s. Das Div ist ja auch um die <a>s herum. Warum ist das dann eigentlich nicht so?

          Mit der Klasse hast du Recht, die ist unnötig. <ul> werd ich einbauen.

          Danke auch für den Tipp mit inline. Ich dachte es müsste block sein, damit nicht width und height ignoriert werden und habe übersehen, dass die <a>s durch das float ja ohnehin blocks werden. Verwunderlich finde ich allerdings, dass man mit der inline-Definition dann nicht den Block-Status aufhebt.

          Jean