IE, CSS & ein <div>, der nicht auf seinen Platz wi

[Kno]

Hallo zusammen,

ich bin grade dabei dieses Design http://root.kno.at/blog/newskeleton.html für die breite Browserpalette aufzubereiten.

Bisher läufts relativ gut, nur der IE/WIN will einfach nicht. Und zwar versetzt er stur den untersten <div> (#footer im CSS, die drei Spalten am unteren Ende) an die Unterkante der Navigation rechts. Alle anderen Browser stellen ihn korrekt direkt unterhalb des Hauptbereichs dar.

Nach zwei Stunden Recherche hab' ich leider noch immer keine funktionierende Lösung gefunden - hat hier jemand einen Tipp?

[Kno]

Habe das Problem jetzt über Conditional Comments in den Griff bekommen, indem ich die Höhe des <div>, der die Navigation enthält, für IE per Stylesheet auf 0 gesetzt hab.

Kommt mir aber nicht grade schön vor, vielleicht hat jemand einen anderen Tipp.

[Laus]

Hallo

Ich vermute das liegt da der Breite die der IE etwas anders berechnet als die anderen Browser. Auch fehlt ein abschließendes Clear nach dem float. Werde mich aber noch etwas intensiver damit beschäftigen

::Edit::
Gib deinem Footer noch zusätzlich ein display:inline; wegen des doppelfloat margin Bugs des IE also

Code: Alles auswählen

#footer .foot { display:inline;
                    float:left;
                    margin:1em; width:12em;
               }

Dein Html solltest du folgendermaßen andern

Code: Alles auswählen

<div id="main">
            <div class="entry">
              <!--<div> -->
                <span class="date">20. Aug 06</span>
                <h1><a href="newskeleton2.html">We offer - think before talking</a></h1>
                <div><img src="newskeleton-Dateien/100.jpg" alt=""></div>
                <p>
                  Eintragstext. Und zwar ein ganz schön beachtlicher langer
                  Vorschau. Immerhin will i kane halben Sachen machen,</p>
                <span class="com">x Komm.</span>
              <!--</div>-->
              <a class="wholething" href="newskeleton2.html"></a>
            </div>

            <div class="entry">
               <!--<div>-->
                <span class="date">20. Aug 06</span>
                <h1><a href="newskeleton2.html">It's all about our furry friends</a></h1>
                <div></div>
                <p>
                  Eintragstext. Und zwar ein ganz schön beachtlicher langer
                  Vorschau. Immerhin will i kane halben Sachen machen,</p>
                <span class="com">x Komm.</span>
               <!--</div>-->
              <a class="wholething" href="newskeleton2.html"></a>
            </div>

            <div class="entry">
              <!--<div>-->
                <span class="date">20. Aug 06</span>
                <h1><a href="newskeleton2.html">The madness begins</a></h1>
                <div><img src="newskeleton-Dateien/newbg.gif" alt=""></div>
                <p>
                  Eintragstext. Und zwar ein ganz schön beachtlicher langer
                  Vorschau. Immerhin will i kane halben Sachen machen,</p>
                <span class="com">x Komm.</span>
              <!--</div>-->
              <a class="wholething" href="newskeleton2.html"></a>
            </div>
        </div>
<!-- </div> bisheriges ende #main -->

    <div id="footer">

        <div id="foot1" class="foot">
          <h2>Yours Sincerely,</h2>
          <ul>
            <li>ICQ: <a href="http://people.icq.com/people/about_me.php?uin=151145966">151145966</a></li>
            <li>Skype: <a href="skype:c.knoflach">c.knoflach</a></li>
            <li><a href="https://www.openbc.com/hp/Christian_Knoflach/">OpenBC</a></li>
            <li><a href="mailto:christian@kno.at">christian@kno.at</a></li>
            <li>+43 699/1276 58 18</li>
          </ul>
        </div>

        <div id="foot2" class="foot">
          <h2>Latest Pictures</h2>
          <ul>
            <li><a href="newskeleton2.html">A so a Dreck! Deis is ...</a></li>
            <li><a href="newskeleton2.html">Hm irgendwie denk i da ...</a></li>
            <li><a href="newskeleton2.html">Oiso i darat jo viel eher ...</a></li>
            <li><a href="newskeleton2.html">Ahahahaha mir follat nix ...</a></li>
            <li><a href="newskeleton2.html">Eigentlich scho a ...</a></li>
          </ul>
        </div>

        <div id="foot3" class="foot">
          <h2>Current Shorts</h2>
          <ul>
            <li><a href="newskeleton2.html">Pet Sounds</a></li>
            <li><a href="newskeleton2.html">Party? Party!</a></li>
            <li><a href="newskeleton2.html">Irish Rock</a></li>
            <li><a href="newskeleton2.html">Bye, bye WAK</a></li>
            <li><a href="newskeleton2.html">Finally - A ...</a></li>
          </ul>
        </div>
      </div>
    </div><!-- ende #main -->
</div>
</body></html>

dann müsste es auch in allen Browsern gleich aussehen.

Xaver