Schaltflächen mit div

[Struppi]

.menugroup { display:block; background:#800000; color:#ffffff; font-family:"Arial","Helvetica",sans-serif; font-size:13px; text-align:center; width:90px; margin:1px; height:16px; }

a.menuitem { display:block; background-image:url(hintergrund.gif); background-repeat:no-repeat; height:15px; padding-left:9px; text-align:left; width:120px; font-family:"Arial","Helvetica",sans-serif; font-size:12px; text-decoration:none; margin:1px; }

a.menuitem:link    { color:#ffffff; background-color:#c00000; }
a.menuitem:visited { color:#ffffff; background-color:#c00000; }
a.menuitem:hover   { color:#ffffff; background-color:#ff4000; }
a.menuitem:active  { color:#ffffff; background-color:#c00000; }

Und hier ein html-Ausschnitt:

<div>
   <span class="menugroup">Überschrift</span>
   <a class="menuitem" href="datei1.html">Link 1</a>
   <a class="menuitem" href="datei2.html">Link 2</a>
</div>

Naja, eine Überschrift sollte ein Hx sein und die Klassen musst du auch nicht unbedingt zuweisen.

Mach's eher so:
<div id="menu">
<h1>Überschrift</h1>
<a href="datei1.html">Link 1</a>
<a href="datei2.html">Link 2</a>
</div>

CSS:
#menu h1{
background:#800000;
color:#ffffff;
font-family:"Arial","Helvetica",sans-serif;
font-size:13px;
text-align:center;
width:90px;
margin:1px;
height:16px;
}

#menu a:link{
display:block;
background-image:url(hintergrund.gif);
background-repeat:no-repeat;
height:15px;
padding-left:9px;
text-align:left;
width:120px;
font-family:"Arial","Helvetica",sans-serif;
font-size:12px; text-decoration:none; margin:1px;
}

#menu a:link    { color:#ffffff; background-color:#c00000; }
#menu a:visited { color:#ffffff; background-color:#c00000; }
#menu a:hover   { color:#ffffff; background-color:#ff4000; }
#menu a:active  { color:#ffffff; background-color:#c00000; }

Struppi.