Hallo allerseits!
Mir stellt sich gerade folgendes Problem:
Ich will einen Link in einer Tabelle erstellen
- die in ihren Zellen ein Padding (von 5px) verwendet
- der eine komplette Tabellenzelle ausfüllt
- nicht am linken Rand der Zelle klebt
- linksbündig (nicht zentriert) dargestellt wird
- und dabei kein JavaScript verwenden.
Im Code habe ich meine bisherigen Überlegungen zum Thema hinterlegt.
Link 1 füllt aufgrund des Paddings nicht die ganze Zelle aus,
Link 2 fehlt was in der Höhe und er klebt am linken Rand,
Link 3 klebt am linken Rand, füllt aber immerhin die ganze Zelle aus,
Link 4 schießt am rechten Rand über das Ziel hinaus, klebt aber nicht mehr am linken Rand.
Perfekt wäre also ein Link, der die Zelle ausfüllt wie Link 3 und an der Stelle von Link 4 erscheint. Ich hoffe mein Problem ist damit klar. Über jegliche Hilfe würde ich mich freuen!
Beste Grüße
Mat
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de">
<head>
<title>Table test</title>
<style type="text/css">
table
{ width: 100%; }
td
{ padding: 5px;
border: 1px solid black; }
.td_link
{ padding: 0px; }
td a
{ color: black;
display: block;
margin: 0px;
height: 100%;
width: 100%; }
td a:hover
{ color: white;
background-color: black; }
.padding
{ padding: 5px 0px 5px 0px; }
.padding_zuviel
{ padding: 5px 0px 5px 5px; }
</style>
</head>
<body>
<table>
<tr>
<td>inhalt</td>
<td>
<a href="test.htm">test</a>
</td>
<td>inhalt</td>
</tr>
<tr>
<td>inhalt</td>
<td class="td_link">
<a href="test.htm">zelle ohne padding</a>
</td>
<td>inhalt</td>
</tr>
<tr>
<td>inhalt</td>
<td class="td_link">
<a href="test.htm" class="padding">link mit padding</a>
</td>
<td>inhalt</td>
</tr>
<tr>
<td>inhalt</td>
<td class="td_link">
<a href="test.htm" class="padding_zuviel">zuviel padding</a>
</td>
<td>inhalt</td>
</tr>
</table>
</body>
</html>