Beat: Abstand zwischen Links zu gross

Beitrag lesen

Mein Problem sieht folgendermassen aus:
http://img374.imageshack.us/img374/7785/problemlo1.jpg
Der Abstand zwischen den einzelnen "<p>-boxen" sollte eigentlich nur 3px betragen. Mein HTML/CSS-code dazu sieht so aus:

<link rel="stylesheet" type="text/css" href="css.css" />

</head>

<body background="images/pattern.gif">
<div id="outertb">
<div id="banner"><img src="images/chibibanner.gif" alt="Chibisuke-Scans"/></div>
<table class="maintb" cellpadding="0" cellspacing="0">
  <tr><td class="menu_column">
   <table class="menu" cellpadding="0" cellspacing="0">
    <tr><td><a href="ahd"><p>home</p></a><a href="ahd"><p>home</p></a><a href="ahd"><p>home</p></a><a href="ahd"><p>home</p></a><a href="ahd"><p>home</p></a><a href="ahd"><p>home</p></a>
    </td></tr></table></td>
   <td class="content">ökljölj</td></tr>
</table>
<div id="footer"></div>
</div>
</body>

  
Zu diesem Code möchte ich bemerken, dass du eine Layout-Tabelle in einer Layout-Tabelle verwendest.  
Damit ist praktisch garantiert, dass du die Übersicht verlieren wirst.  
Auch finde ich dass eine Liste besser wäre, um dein menu darzustellen. Formal handelt es sich auch um eine Liste.  
  
Dann versuchst du, in ein <a> Element ein <p> Element hineinzustellen. Das ist dir aber laut HTML 4.01 nicht erlaubt.  
  
Ich würde dir folgenden Code für das menu vorschlagen:  
  
~~~html
  
<ul id="navigation">  
  <li><a href="ahd">home</a></li>  
  ...  
</ul>  

wobei das css folgende Einträge erhält

#navigation {margin:0; padding: 0; list-style:none; }  
#navigation li { margin: 3px 0;} /* hier deine Formatierung */  
#navigation a {display:block; } /* hier deine Formatierung */  
#navigation a:hover {background-color:#666; } /* hier deine Formatierung */  

display:block für <a> wird dann bewirken, dass der Link die ganze Breite des <li> Elements einnimmt.

mfg Beat

--
Woran ich arbeite:
X-Torah
><o(((°>        ><o(((°>
   <°)))o><                      ><o(((°>o