Felix Riesterer: leere DIVs

Beitrag lesen

Liebe sandra,

nicht immer muss es ein <div> sein. Was spricht denn gegen folgendes Konstrukt?

<p class="rund">  
    <span class="oben"></span>  
    <span class="unten-links"></span>  
    <span class="unten-rechts"></span>  
    Hier steht der eigentliche Inhalt...  
</p>

Das macht die Sache zwar kaum besser, aber semantisch ist es doch etwas anderes, denn das eigentliche Element (<p>) ist ein echter Textabsatz und dazu nicht in bedeutungslose Elternelemente verschachtelt.

Die Möglichkeiten von CSS3 mit border-radius wurden bereits angesprochen. Es ist die Frage, ob Du veraltete Browser, die das noch nicht unterstützen, überhaupt noch so vollumfänglich bedienen willst.

Wenn Deine abgerundeten Elemente eine feste Breite haben, dann genügt bereits ein leeres Element am Anfang, da Du dann eine lange schmale Grafik mit zwei runden Ecken als Hintergrundbild verwenden kannst. Da sparst Du gleich zwei sinnbefreite Elemente ein:

<p class="rund">  
    <span class="oben"></span>  
    Hier steht der eigentliche Inhalt...  
</p>

Im obigen Beispiel könnte das so aussehen:

.rund        .oben

|   .--------.
       |   |        |
       |
       |

°--------°

Liebe Grüße,

Felix Riesterer.

--
ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:)