Hi Leute,
ich bin gerade dabei, für meine Website ein neues Design zu machen und habe dazu eine Frage.
[Blockierte Grafik: http://www.postimage.org/aV425SB9.jpg]
In diesem Screenshot sieht man das Menu. Darunter soll der Inhalt stehen (also bei "Zauberer"). Die rechte Spalte ist das Submenu.
Hier der Code dazu:
Code
<table width=960px>
<tr>
<td>
[img]./images/logo.jpg[/img]
</td>
</tr>
<tr>
<td>
<table>
<tr>
<td class="content2" width="110px" valign=top>
<a href="" class="menubutton">Home
</a>
</td>
<td class="content2" width="110px" valign=top>
<a href="" class="menubutton">Über uns
</a>
</td>
<td class="content2" width="110px" valign=top>
<a href="" class="menubutton">Aktuelles
</a>
</td>
<td class="content2" width="110px" valign=top>
<a href="" class="menubutton">Buchung
</a>
</td>
<td class="content2" width="110px" valign=top>
<a href="" class="menubutton">Features
</a>
</td>
</tr>
</table>
<table>
<tr>
<td class="content" width="800px" valign="top">
<div id="line">Zauberer</div>
</td>
<td class="sidebar" width="160px" valign=top>
[url='']Chat[/url]
[url='']Board[/url]
</td>
</tr>
</table>Jetzt meine Frage: Ich möchte, dass die Menu-Buttons direkt an den Content angrenzen. Das ist aber wegen den CSS-Formatierungen leider nicht ganz möglich:
Code
.content {
background: white;
padding: 5px;
}
.content2 {
background: white;
}
.sidebar {
background: #363636;
color: white;
padding: 5px;
}
a.submenubutton, a.submenubutton:link, a.submenubutton:visited {
text-decoration: none;
background-color: #222222;
padding: 2px;
padding-left: 15px;
font-variant: small-caps;
font-weight: bold;
color: white;
display: block;
}
a.submenubutton:hover, a.submenubutton:focus, a.submenubutton:active {
text-decoration: none;
background: #464646;
padding: 2px;
padding-left: 15px;
font-variant: small-caps;
font-weight: bold;
color: white;
display: block;
}
a.menubutton, a.menubutton:link, a.menubutton:visited {
text-decoration: none;
background: url(../images/menubutton.jpg) no-repeat;
padding-top: 15px;
padding-left: 18px;
font-variant: small-caps;
font-weight: bold;
color: white;
display: block;
}
a.menubutton:hover, a.menubutton:focus, a.menubutton:active {
text-decoration: none;
background: url(../images/menubutton_hover.jpg) no-repeat;
padding-top: 15px;
padding-left: 18px;
font-variant: small-caps;
font-weight: bold;
color: white;
display: block;
}Kann mir wer helfen?
Danke!