Clear cleart nicht?

[Lupinius]

Salve

Ich habe probiert mehrere Blogeinträge per CSS nebeneinander anzuordnen. Der erste Eintrag wird groß alleine dargestellt, die anderen jeweils in Zweiergruppen untereinander. Darunter folgt eine Seitennavigation mit der Eigenschaft clear: both. Allerdings wird der Text auch neben den Einträgen angezeigt.

<div class="post">  
    <h2>Überschrift</h2>  
    Ganz viel Inhalt  
</div>  
<div class="post">  
    <h2>Überschrift</h2>  
    Ganz viel Inhalt  
</div>  
<div class="post">  
    <h2>Überschrift</h2>  
    Ganz viel Inhalt  
</div>  
<div class="post">  
    <h2>Überschrift</h2>  
    Ganz viel Inhalt  
</div>  
<span id="page">Seite <a href="#">1</a>, <a href="#">2</a>, <a href="#">3</a> [<a href="#">Zurück&lt;&lt;</a> <a href="#">&gt;&gt;Vor</a>]</span>

Dazu kommt folgender CSS-Code:

div.post {  
    padding: 1em 2.5%;  
}  
  
div.post + div.post{  
    float: left;  
    width: 45%;  
}  
  
span#page {  
    clear: both;  
    width: 100%;  
    text-align: center;  
}

Wo liegt der Fehler?

[ChrisB]

Hi,

Darunter folgt eine Seitennavigation mit der Eigenschaft clear: both. Allerdings wird der Text auch neben den Einträgen angezeigt.

<span id="page">Seite <a href="#">1</a>, <a href="#">2</a>, <a href="#">3</a> [<a href="#">Zurück&lt;&lt;</a> <a href="#">&gt;&gt;Vor</a>]</span>[/code]

span#page {

Wo liegt der Fehler?

Die Fehler - es sind mehrere.

Erstens, dass du so etwas wie eine Navigation mit einem sinnfreien SPAN auszeichnest, anstatt als Liste.

Zweitens, dass du dich nicht informiert hast, für welche Elemente clear Wirkung zeigt;
http://www.w3.org/TR/CSS21/visuren.html#flow-control:
Applies to:   block-level elements

(Letzteres wäre aber gar nicht aufgefallen, wenn du statt des SPANS gleich eine vernünftige Liste gewählt hättest - auf der hätte clear nämlich gewirkt.)

MfG ChrisB

[Lupinius]

Salve

Danke, da lag (natürlich) das Problem. Aber wie sollte bei einer solchen Navigation die Liste aussehen? Bei normaler Navagtionen (wie "Hauptseite, Gästebuch, Impressum") ist mir das klar, aber wie sollte das hier aussehen?

[ChrisB]

Hi,

Aber wie sollte bei einer solchen Navigation die Liste aussehen? Bei normaler Navagtionen (wie "Hauptseite, Gästebuch, Impressum") ist mir das klar, aber wie sollte das hier aussehen?

Durch entsprechende Formatierung.
Stichwort Listamatic.

MfG ChrisB