Button Problem

[XJuergenX]

huhu

Ich hab da ein Problem ich würde gerne Buttons auf der HP von einem Bekannten [URL="http://www.---.de"]http://www.---.de[/URL] enger aneinanderschieben aber leider bekomm ich das nicht gebacken also in Prinzip haben die vom einem zum anderen eine Lücke und die soll weg

Link zum Navi: -----

lg
XJuergenX

 

[Yume]

Ich habe es mal tabelarisch gelöst. ;)

edit: achja, man sieht nix von den Rahmen der Tabelle ... ist alles "unsichtbar".

<p align="center">
<table style="text-align: center; width: 139px;" border="0"
 cellpadding="0" cellspacing="0">
  <tbody>
    <tr>
      <td height="45" width="139"><font size="6">
      <a href="hp.html" target="main"
 onmouseover="image.src='http://www.bbw-spindelwag.de/pictures/Start.JPG';"
 onmouseout="image.src='pictures/button.jpg';"><img
 name="image" src="pictures/button.jpg" height="45"
 width="139"></a></font></td>
    </tr>
    <tr>
      <td height="45" width="139"><a
 href="Bude.html" target="main"
 onmouseover="image2.src='http://www.bbw-spindelwag.de/pictures/Bude.JPG';"
 onmouseout="image2.src='pictures/button.jpg';"><img
 name="image2" src="pictures/button.jpg" height="45"
 width="139"></a>
      </td>
    </tr>
    <tr>
      <td height="45" width="139"><a
 href="members.html" target="main"
 onmouseover="image3.src='http://www.bbw-spindelwag.de/pictures/Members.JPG';"
 onmouseout="image3.src='pictures/button.jpg';"><img
 name="image3" src="pictures/button.jpg" height="45"
 width="139"></a>
      </td>
    </tr>
    <tr>
      <td height="45" width="139"><a
 href="bilder.html" target="main"
 onmouseover="image4.src='http://www.bbw-spindelwag.de/pictures/Bilder.JPG';"
 onmouseout="image4.src='pictures/button.jpg';"><img
 name="image4" src="pictures/button.jpg" height="45"
 width="139"></a>
      </td>
    </tr>
    <tr>
      <td height="45" width="139"><a
 href="party.html" target="main"
 onmouseover="image5.src='http://www.bbw-spindelwag.de/pictures/Partys.JPG';"
 onmouseout="image5.src='pictures/button.jpg';">
      <img name="image5" src="pictures/button.jpg"
 height="45" width="139"></a></td>
    </tr>
    <tr>
      <td height="45" width="139"><a
 href="http://www.00book.de/19995-1.html" target="main"
 onmouseover="image6.src='http://www.bbw-spindelwag.de/pictures/Gaeste.JPG';"
 onmouseout="image6.src='pictures/button.jpg';"><img
 name="image6" src="pictures/button.jpg" height="45"
 width="139"></a>
      </td>
    </tr>
    <tr>
      <td height="45" width="139"><a
 href="Kontakt.html" target="main"
 onmouseover="image7.src='http://www.bbw-spindelwag.de/pictures/Kontakt.JPG';"
 onmouseout="image7.src='pictures/button.jpg';">
      <img name="image7" src="pictures/button.jpg"
 height="45" width="139"></a></td>
    </tr>
    <tr>
      <td height="45" width="139"><a
 href="Links.html" target="main"
 onmouseover="image8.src='http://www.bbw-spindelwag.de/pictures/Links.JPG';"
 onmouseout="image8.src='pictures/button.jpg';"><img
 name="image8" src="pictures/button.jpg" height="45"
 width="139"></a>
      </td>
    </tr>
    <tr>
      <td height="45" width="139"><a
 href="Spiele.html" target="main"
 onmouseover="image9.src='http://www.bbw-spindelwag.de/pictures/Spiele.JPG';"
 onmouseout="image9.src='pictures/button.jpg';"><img
 name="image9" src="pictures/button.jpg" height="45"
 width="139"></a>
      </td>
    </tr>
    <tr>
      <td height="45" width="139"><a
 href="Chat.html" target="main"
 onmouseover="image10.src='http://www.bbw-spindelwag.de/pictures/Chat.JPG';"
 onmouseout="image10.src='pictures/button.jpg';"><img
 name="image10" src="pictures/button.jpg" height="45"
 width="139"></a>
      </td>
    </tr>
    <tr>
      <td height="45" width="139"><a
 href="Fun.html" target="main"
 onmouseover="image11.src='http://www.bbw-spindelwag.de/pictures/Fun.JPG';"
 onmouseout="image11.src='pictures/button.jpg';"><img
 name="image11" src="pictures/button.jpg" height="45"
 width="139"></a>
      </td>
    </tr>
  </tbody>
</table>
</p>

 

[XJuergenX]

Vielen Dank netter zug von dir :)

 

[JAGOGNUSSEL]

Hi XJürgenX !

Bei Tabellen wirst Du immer Zwischenräume haben. Nutze deshalb besser CSS-Anweisungen. Zum Beispiel auf Deiner HTML-Seite, wo sich Deine Navigation befindet im "head-Bereich":

<style type="text/css">
<!--
p.p_eins {
position : absolute;
top : 30px;
left : 10px;
}
p.p_zwei {
position : absolute;
top : 65px;
left : 10px;
}
p.p_drei {
position : absolute;
top : 100px;
left : 10px;
}
-->
</style>
</head>
<body>
 
<p class="p_eins">Nav_01</p>
<p class="p_zwei">Nav_02</p>
<p class="p_drei">Nav_03</p>
<!-- und so weiter - und so weiter -->
</body>

Nun kannst Du Deine Buttons verrücken, so wie Du es willst!

Viel Spaß!!!
Jagognussel


Mod-Edit: Code-Tags hinzugefügt. (gutschiguh)

 

[ice2k3]

Beste Lösung:

[css]

#menu a 
{
 text-align: center;
 display: block;
 background: url(button.png);
 height: 30px;
 width: 50px;
}

[html]
<div id="menu">
<a href="links1.html">Links1</a><br />
<a href="links2.html">Links2</a><br />
...
</div>

Layouten mit Tabellen, sowas tut doch weh, grml :-?


Mod-Edit: Code-Tags hinzugefügt. (gutschiguh)

 

[edi]

kontrolliere deine Schreibweise :-)
Bude.html solltest Du lieber nicht gross schreiben.