kristin: probleme mit der ausrichtung und breite von <div>-feldern

Beitrag lesen

Hello out there!

ich möchte meine website mit <div> aufbauen.

Das ist krank: Divitis [Wikipedia]

  1. die schrift wird nicht vertikal zentriert ausgerichtet. "vertical-align: middle" funktioniert nicht. warum?

Wegen „'vertical-align'
Angewendet auf: Elemente auf Inline-Ebene und 'table-cell'-Elemente“ [CSS2 §10.8]

das heisst, ich kann vertical-align nur im <span> anwenden, aber nicht in den <div>-feldern? gibt es eine möglichkeit, auch für <div>-felder?

  1. die einzelnen Navigationspunkte sollen jeweils eine breite von 16,6% haben (da es sechs navigationspunkte hat und die den selben abstand haben sollen)
  2. der bereich "topic" soll genauso lang sein, wie die navigation. wenn ich aber in beiden "width: 60%" angebe ist topic länger als navigation. weil sie an verschiedenen punkten beginnen? warum?

Mit dem Box-Modell [CSS2 §8] bist du vertraut?

nicht so ganz. aber ich habe auf der seite ganz oben folgendes eingetragen: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/transitional.dtd">

<div class="navigation" style="vertical-align: middle;">
   <span style="width: 16,6%;" class="navi_aktuell"><a href="about.html">&#220;ber uns</a></span>
   <span style="width: 16,6%;"><a href="angebot_basis.html">Angebote</a></span>
   <span style="width: 16,6%;"><a href="galerie.html">Galerie</a></span>
   <span style="width: 16,6%;"><a href="kontakt.html">Kontakt</a></span>
   <span style="width: 10%;"><a href="agb.html">AGB</a></span>
   <span style="width: 10%;"><a href="impressum.html">Impressum</a></span>
  </div>

Eine Liste ist eine Liste ist eine Liste.

aber ich möchte keine liste. die navigationspunkte sollen nebeneinander stehen aber schön im gleichen abstand.

<ul class="navigation">

<li style="width: 16,6%;" class="navi_aktuell"><a href="about.html">&#220;ber uns</a></li>
   <li style="width: 16,6%;"><a href="angebot_basis.html">Angebote</a></li>
   <li style="width: 16,6%;"><a href="galerie.html">Galerie</a></li>
   <li style="width: 16,6%;"><a href="kontakt.html">Kontakt</a></li>
   <li style="width: 10%;"><a href="agb.html">AGB</a></li>
   <li style="width: 10%;"><a href="impressum.html">Impressum</a></li>
  </ul>


>   
> Die Verwendung von style-Attributen geht der Trennung von Struktur (HTML) und Darstellung (CSS) zuwider. Verzichte besser darauf und mach sämtliche Angaben im zentralen Stylesheet.  
  
die darstellung ist auch in einer zentralen datei. aber zur anwendung habe ich sie hier mit eingefügt.  
  

>   
> See ya up the road,  
> Gunnar