Anders Winkler: CSS floating - Mein Fehler?

Beitrag lesen

SELF-Forum

CSS floating - Mein Fehler?

Anders Winkler
– Informationen zu den Bewertungsregeln

Hallo Forum,

folgender HTML-Code zeigt mir im Firefox 0.9.3 die Blöcke gestuft von links oben nach rechts unten an, statt diese untereinander zu zeichnen. Nehme ich die CSS-Regel mit dem Selektor "#liste .tit" weg, so macht FF es dann doch richtig. Im IE5 sieht es in beiden Fällen ok aus, was ist falsch an meinem Code?

Danke vielmals für Eure Hilfe, Anders

P.S.: nicht sauer sein, wenn ich erst Morgen antworten kann, der Samstagabend ruft mich :)

<html>

<head>
  <title>test.html</title>

<style type="text/css">
  #liste {
    padding-left:0px;
    list-style:none;
  }

#liste .tit {
    font-size: 15px;
    font-weight:bold;
  }

#liste .image {
    float:left;
    margin: 10px 10px 10px 10px;
    width:100px;
  }
  </style>
</head>
<body>

<ul id="liste">
  <li>
    <img src="http://img.stern.de/img/abo/weltall.jpg" class="image" />
    <h1 class="tit">Das ist der Titel</h1>
    <p class="desc">Das ist die Beschreibung</p>
    <p class="year">2001</p>
  </li>
  <li>
    <img src="http://img.stern.de/img/abo/weltall.jpg" class="image" />
    <h1 class="tit">Das ist der Titel</h1>
    <p class="desc">Das ist die Beschreibung</p>
    <p class="year">2001</p>
  </li>
  <li>
    <img src="http://img.stern.de/img/abo/weltall.jpg" class="image" />
    <h1 class="tit">Das ist der Titel</h1>
    <p class="desc">Das ist die Beschreibung</p>
    <p class="year">2001</p>
  </li>
  <li>
    <img src="http://img.stern.de/img/abo/weltall.jpg" class="image" />
    <h1 class="tit">Das ist der Titel</h1>
    <p class="desc">Das ist die Beschreibung</p>
    <p class="year">2001</p>
  </li>
</ul>

</body>
</html>

Beitrag melden
–
Informationen zu den Bewertungsregeln