Problem mit Buttons

Hi,
bin auf der Suche für mein Problem auf dieses Forum gestoßen. Vlt könnt ihr mir ja weiterhelfen:

Zu meinem Problem.
Ich habe eine Website mit dem „Slice-Werkzeug“ von Photoshop erzeugt, da es mir die Umsetzung meiner Designvorstellungen erheblich erleichtert hat. Einige dieser Bilder habe ich verlinkt um aus ihnen Navigationsbuttons zu erstellen. Das ganze hab ich zur optischen Verschönerung mit einem mouseover-Effekt versehen. Wenn ich nun allerdings mit dem Mauszeiger über einen dieser Buttons fahre, verschiebt sich dieser rund 2-3 Pixel nach oben, was er natürlich nicht soll. Darunter bleibt ein weißer Streifen. Wenn ich mit dem Mauszeiger wegbewege, geht der Button wieder in seine Ausgangsposition zurück.
Weiß jemand von euch eine Lösung zu dem Problem?

Bin für jede Hilfe dankbar.

mfg
housefr3@k

Glaskugel rauskram
Ommm…
Ich sehe…
Dunkelheit…
Nein!
Jemand hat ein Problem…
…ein Code-Problem…
…vermutlich CSS-Abstände…
…Dunkelheit…

Ich kann nichts mehr sehen!

Danke erstmals für die Antwort.

Ich hoffe ich habe sie richtig interpretiert.
Wenn ich dem Bild nun folgendes zuweise, ändert sich leider auch nichts.

[html]
#image
{
padding:0px;
margin:0px;
}
[/html]Was ich vlt noch dazusagen sollte ist, dass die Website durch das Slice-Werkzeug nun als Tabelle aufgebaut ist.

Efchen meint: „Code her, sonst fällt die Hilfe schwer!“ (Gerade selbst ausgedacht!)
Edit: „Link her, sonst fällt die Hilfe schwer!“ ist wohl angebrachter :wink:

PS: Tabellen-Layout = schlecht.

Nein.

Was ich vlt noch dazusagen sollte ist, dass die Website durch das Slice-Werkzeug nun als Tabelle aufgebaut ist.

Das brauchst Du nur zu sagen, wenn Du Masochist bist. Aber das bist Du ja anscheinend, wenn Du sowas machst.
Warum Layout mit Tabellen dumm ist: Probleme definiert, Lösungen angeboten

Grüße,
-Efchen

Sry, hier der Code:

[code]

<tr>
    <td colspan="2" id="button">
        <a href="javascript:austausch('link3','navi','link4','content')">
        <img src="http://www.html.de/images/banner_navi3_sliced_06.png" alt="" name="Image1" width="139" height="19" border="none" id="Image1" onMouseOver="MM_swapImage('Image1','','images/banner_konzept8_selected_03.png',0)" onMouseOut="MM_swapImgRestore()"></a></td>
    <td rowspan="2">
        <img src="http://www.html.de/images/banner_navi3_sliced_07.png" width="14" height="44" alt="">        </td>
    <td id="button">
        <a href="javascript:austausch('link5','navi','link6','content')">
        <img src="http://www.html.de/images/banner_navi3_sliced_08.png" alt="" width="139" height="19" border="none" onMouseOver="MM_swapImage('Image2','','images/banner_konzept8_selected_05.png',1)" onMouseOut="MM_swapImgRestore()" /></a></td>
    <td rowspan="2">
        <img src="http://www.html.de/images/banner_navi3_sliced_09.png" width="15" height="44" alt=""></td>
    <td id="button"><a href="javascript:austausch('link7','navi','link8','content')"><img src="http://www.html.de/images/banner_navi3_sliced_10.png" alt="" width="139" height="19" border="none" onMouseOver="MM_swapImage('Image3','','images/banner_konzept8_selected_07.png',1)" onMouseOut="MM_swapImgRestore()"></a></td>
    <td rowspan="2">
        <img src="http://www.html.de/images/banner_navi3_sliced_11.png" width="15" height="44" alt=""></td>
    <td id="button">
        <a href="javascript:austausch('link9','navi','link10','content')">
        <img src="http://www.html.de/images/banner_navi3_sliced_12.png" alt="" width="139" height="19" border="none" onMouseOver="MM_swapImage('Image4','','images/banner_konzept8_selected_09.png',1)" onMouseOut="MM_swapImgRestore()"></a></td>
    <td rowspan="2">
        <img src="http://www.html.de/images/banner_navi3_sliced_13.png" width="14" height="44" alt=""></td>
    <td id="button">
        <a href="javascript:austausch('link11','navi','link12','content')">
        <img src="http://www.html.de/images/banner_navi3_sliced_14.png" alt="" width="139" height="19" border="none" onMouseOver="MM_swapImage('Image5','','images/banner_konzept8_selected_11.png',1)" onMouseOut="MM_swapImgRestore()"></a></td>
    <td rowspan="2">
        <img src="http://www.html.de/images/banner_navi3_sliced_15.png" width="13" height="44" alt=""></td>
</tr>
<tr>
    <td colspan="2">
        <img src="http://www.html.de/images/banner_navi3_sliced_16.png" width="139" height="25" alt=""></td>
    <td>
        <img src="http://www.html.de/images/banner_navi3_sliced_17.png" width="139" height="25" alt=""></td>
    <td>
        <img src="http://www.html.de/images/banner_navi3_sliced_18.png" width="139" height="25" alt=""></td>
    <td>
        <img src="http://www.html.de/images/banner_navi3_sliced_19.png" width="139" height="25" alt=""></td>
    <td>
        <img src="http://www.html.de/images/banner_navi3_sliced_20.png" width="139" height="25" alt=""></td></tr>


[/code]dazugehörige css-Stylesheet

[code]
html
{
height:98%;
max-height:98%;
}

body
{
height:100%;
max-height:100%;
margin-top:2px;
}

#button a
{
padding:0px;
margin:0px;
}

#button
{
padding:0px;
margin:0px;
}[/code]Dass es heutezutage nicht mehr sinnvoll ist, Tabellen als Layout zu verwenden, weiß ich, nur leider kenn ich mich mit div-Containern noch weniger aus.

Oh…tut mir leid, vlt kannst mir sagen, wie du es gemeint hast Efchen.

Zurück zur Startseite

Und mit HTML auch nicht. Denn ob man nun Layout mit Tabellen oder Layout mit divs macht ist beides gleich sinnfrei. Layout macht man mit CSS, nicht mit HTML. Und sowohl

, als auch
, sind HTML.
benutzt man, um tabellarische Daten auszuzeichnen,
benutzt man, um mehrere Elemente zwecks gemeinsamer Formatierung zu gruppieren.

vlt kannst mir sagen, wie du es gemeint hast Efchen.

Ich habe es so gemeint, wie Tar-Minyatur bemerkt hat. Dass ich nur raten kann, wenn ich keinen Link zur Seite habe.

In einer Hinsicht hat Tar-Minyatur aber unrecht. Ich meinte nicht, dass ich Code sehen will, ich will nen Link, weil das immer einfacher ist, als der Code. Es wäre ja auch immerhin möglich, dass das Problem bei den Images liegt, die seh ich aber nicht.

Allgemein möchte ich sagen, dass Du Dir eine aktuelle Arbeitsweise angewöhnen sollst. Du nutzt Tabellen fürs Layout und JavaScript für Bildwechsel. Das hat man letztes Jahrtausend gemacht. Das geht alles mit HTML & CSS viel einfacher. Insbesondere Biuldwechsel lassen sich über die CSS-Pseudoklasse „:hover“ viel einfacher und browserübergreifend lösen.

Dann kann man den Code auch wieder lesen und Fehler besser finden - soll heißen, ich sehe für mich keinen Sinn, in dem Code rumzuwühlen, das ist mir zu unübersichtlich.