Felix Riesterer: Verschachtelte DIV

Beitrag lesen

Liebe Sandra,

Du leidest offensichtlich an Divitis, denn Du produzierst eine relativ sinnfreie DIV-Suppe:

<div style='position:absolute;top:50px;left:50px;width:500px;height:400px;margin:0px;padding:0px;'>
<div style='height:30px;'>
  Title
</div>
<div style='border:1px solid #00ff00;'>
  <div style='border:1px solid #ff0000;'>
   <div style='margin:1px;'>
    <div style='width:100%;height:100%;'>
     Content
    </div>
   </div>
  </div>
</div>
</div>

Ich bin mir sehr sicher, dass Du auf mindestens die Hälfte der hier aufgeführten <div>s verzichten könntest, was den Code Deiner Seite wesentlich semantischer machen würde. Beispiel:

<div style='height:30px;'>
  Title
</div>

Wie wäre es stattdessen mit diesem Code? <h1>Title</h1>

Und wozu ist dieses monströse Ding hier gut?

<div style='border:1px solid #00ff00;'>
  <div style='border:1px solid #ff0000;'>
   <div style='margin:1px;'>
    <div style='width:100%;height:100%;'>
     Content
    </div>
   </div>
  </div>
</div>

Nach dem, was ich aus den Style-Angaben erkennen kann, willst Du einen Rahmen mit zweierlei Farben haben... Da könnte ich mir die Verwendung eines passenden Hintergrundbildes vorstellen, das dieselbe Aufgabe erledigt - prompt drei <div>s gespart! Es reicht ja dann ein einziges <div>: <div id="content">Content</div>

Näheres zu sinnvollen HTML-Gerüsten für CSS-basierte Layouts findest Du im <http://de.selfhtml.org/css/layouts/anzeige/kopfundfuss.htm@title=Quelltext zu diesem Beispiel> aus ebendiesem Artikel.

Liebe Grüße aus Ellwangen,

Felix Riesterer.

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