Axel Richter: Gliederung 1. -> 1.1 -> 1.1.1

Beitrag lesen

Hallo,

Stelle ich mir so vor:

1.     EF
1.1    ED
1.1.1  ES

2.     KL
2.1.   KJ

3.     MN

Auch würde ich den Überschriftentext dann reinrücken, bzw. regulieren ob sie bündig abschlißen sollen (so wie ichs oben gemacht habe) oder definiert reinrücken...
margin, padding und text-indent existieren, also ...

Hm, _so_ einfach ist das gar nicht. Das Problem haben wir hier auch schon mal durchgespielt. Folgendes ist dabei als in der Diskussion "bestes" rausgekommen:

  
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"  
        "http://www.w3.org/TR/html4/strict.dtd">  
<html>  
<head>  
<title>Gliederung</title>  
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">  
<style type="text/css">  
ol.gliederung, ol.gliederung * { margin:0; padding:0; }  
ol.gliederung { position:relative; width:300px; } /*Breitenangabe setzt IE hasLayout!*/  
ol.gliederung li { list-style-type:none; padding-left:7ex; margin-top:1em; font-weight:bold; } /*Hauptpunkte*/  
ol.gliederung ol li { padding:0; margin:0; font-weight:normal; font-style:oblique; } /*Unterpunkte*/  
ol.gliederung li span.nummer { position:absolute; left:0; font-style:normal; } /*Nummerierung*/  
</style>  
</head>  
<body>  
<ol class="gliederung">  
 <li><span class="nummer">1</span>Punkt 1  
  <ol>  
   <li><span class="nummer">1.1</span>Punkt 1.1  
    <ol>  
     <li><span class="nummer">1.1.1</span>Punkt 1.1.1 Test, ob das auch mit längerem Text funktioniert.</li>  
    </ol>  
   </li>  
  </ol>  
  <ol>  
   <li><span class="nummer">1.2</span>Punkt 1.2</li>  
  </ol>  
 </li>  
 <li><span class="nummer">2</span>Punkt 2 Test, ob das auch mit längerem Text funktioniert.  
  <ol>  
   <li><span class="nummer">2.1</span>Punkt 2.1</li>  
  </ol>  
  <ol>  
   <li><span class="nummer">2.2</span>Punkt 2.2</li>  
  </ol>  
 </li>  
 <li><span class="nummer">3</span>Punkt 3  
  <ol>  
   <li><span class="nummer">3.1</span>Punkt 3.1 Test, ob das auch mit längerem Text funktioniert.  
    <ol>  
     <li><span class="nummer">3.1.1</span>Punkt 3.1.1</li>  
    </ol>  
    <ol>  
     <li><span class="nummer">3.1.2</span>Punkt 3.1.2</li>  
    </ol>  
   </li>  
  </ol>  
 </li>  
</ol>  
</body>  
</html>  

Ich stelle das hier auch mal zur Diskussion, weil mich interessiert, ob es Kritikpunkte bzw. Verbesserungen an dieser Lösung gibt.

viele Grüße

Axel