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

Beitrag lesen

SELF-Forum

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

Gunnar Bittersmann Homepage des Autors
– Informationen zu den Bewertungsregeln

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]

  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?

<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.

  <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.

See ya up the road,
Gunnar

--
“Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
Beitrag melden
–
Informationen zu den Bewertungsregeln