genial...
ich habe nun 2 Wochen rumgebastelt, dann den entschluss gefasst, dass ich auf den move-Effekt verzichte um letzten Ende festzustellen, dass es garkeine Rolle spielt ob sich der Text bewegt oder nicht, weil es für die Umsetzung keinen Unterschied macht. Das Problem ist geblieben.
Durch die Zellenformatierung (Tabellenzelle als Link) entsteht automatisch ein nues div, dessen Text ist wieder nicht zentriert steht. Inzwischen konnte ich das Problem dann scheinbar doch, wenn auch weniger zufriedenstellend, lösen.
Ich muss die Daten jetzt nochmal anpassen und dann zeige ich mal das Ergebnis.
EDIT 14:15:
So, ich hab noch eine deutlich bessere Lösung gefunden als die vorherige. Das ist wohl einfacher als jede Andere Möglichkeit. Allerdings ist in dieser Version ebenfalls kein beweglicher Text vorhanden, aber die Buttons habe ich ja bereits angepasst.
Schade, dass ich keinen Weg gefunden habe den Text auf die alten Buttons anzupassen.
Aber vielleicht wird es ja noch einmal eine Lösung geben und dann lässt sich diese ja immernoch einfügen. Ich bin auf jeden Fall froh, dass ich jetzt endlich mit den Arbeiten an der Seite anfangen kann.
Falls es irgendwas zu bemängeln gibt, lasse ich mich auf jeden Fall gerne belehren. Auch falls jemand einen alternativen Weg kennt oder eine Lösung für das Ursprüngliche Problem hat.
In einigen Tagen wird der gesamte Code und das Design der Seite dann im entsprechenden Bereich zu sehen sein, damit ich noch einmal auf Nummer sicher gehen kann, dass ich alles richtig gemacht habe.
Danke nochmals,
Gruß Chris
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>TEST</title>
<style type="text/css">
td.link{
background: url('../images/buttonhoch1.png');
background-position:center;
background-repeat:no-repeat;
color: #fff;
text-align:center;
cursor:pointer;
}
td.link:hover{
background: url('../images/buttontief1.png');
background-position:center;
background-repeat:no-repeat;
text-align:center;
cursor:pointer;
}
</style>
</head>
<body>
<table width="200px" height="100px">
<tr>
<td height="33%" width="33%" class="link" onClick="location.href='#'">TESTBUTTON</td>
</tr>
</table>
</body>
</html>
Wer den Code anweden will muss natürlich die Grafiken gegen eine Farbe oder eigene Grafikdateien tauschen.