Gunnar Bittersmann: Textposition innerhalb eines CSS-Buttons

Beitrag lesen

Hello out there!

Linksbündig geht ja, aber er läßt sich nicht dazu überreden, nach unten zu wandern. Vielleicht hat ja jemand eine Idee?!

a.menu:link    {
vertical-align: middle;

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

Mit 'line-height' ließe sich da wohl was machen – solange der Linktext nur einzeilig ist, worauf du aber wenig bis gar keinen Einfluss hast.

Eher bieten sich wohl 'margin-top' oder 'padding-top' an.

<div id="menu">
   <div align="left">
            <a class="menu" href="index.htm"> Home</a>
   <a class="menu" href="links/index.htm">Links</a>
     <a class="menu" href="mailto:name@domain.de">&nbsp;E-Mail</a>
            </div>
</div>

Wie hat sich das 'align'-Attribut dahin verirrt, wenn du doch _alle_ Darstellungsangaben mit CSS machen möchtest?

Die Klassifizierung der 'a'-Elemente macht keinen Sinn, wenn sie alle derselben Klasse angehören. Du kannst sie in CSS auch mit dem Nachfahrenselktor selektieren: '#menu a {}'.

Den Sinn von zwei verschachtelten 'div' sehe ich auch nicht. Außerdem: Warum 'div'?

Ich möchte gern eine Liste sein, bitte bitte lass mich ein 'ul' ('ol') sein! (frei nach wahsaga)

So sollte es aussehen:

<ul id="menu">  
  <li><a href="index.htm">Home</a></li>  
  <li><a href="links/index.htm">Links</a></li>  
  <li><a href="mailto:name@domain.de">E-Mail</a></li>  
</ul>

Aber natürlich Punkt 10 der zehn meist-missachteten Homepage-Design-Richtlinien [Nielsen] beachten: „Verlinke niemals auf die aktuelle Seite.“

See ya up the road,
Gunnar

--
„Wer Gründe anhört, kommt in Gefahr nachzugeben.“ (Goethe)