# ganze zelle verlinken



## xony (9. Juni 2004)

Hallo Forum,

ich hab ein kleines Problem und noch keine richtige Lösung gefunden.
Ich möchte per css eine komplette zelle verlinken.

Bisher hab ich es nur geschafft das die komplette Zelle die Farbe wechselt beim Mousover.

Ich Arbeite mit einer externen Stylesheet. Vielen Dank füre eure Hilfe.


----------



## Fabian H (9. Juni 2004)

Du könntest folgenden Link benutzen:

```
<td><a href="ziel.html" style="display:block;">Lnk</a></td>
```


----------



## xony (9. Juni 2004)

danke, aber leider passiert nix.


----------



## Fabian H (9. Juni 2004)

Sorry, hab vergessen, dass der IE zu schlecht ist, um das da oben richtig anzuzeigen...

```
<td><a href="foo.html" style="display:block:width:100%;">Link</a></td>
```
So sollte es auch der IE richtig machen.


----------



## xony (9. Juni 2004)

Also ich danke Dir wirklich, vielleicht hab ich auch was übersehen, aber es passiert nix.
Hier einmal main Quellcode für den Button:


```
td.normal 
{ 
width:100%; 
height:18px; 
background-color:#ccc; 
border-width:1px; 
border-style:solid; 
border-color:#ccc; 
font-family:Tahoma, Verdana; 
font-size:11px; 
color:#fff; 
padding-left:11px; 
style-DISPLAY: block  width:100%;

cursor:hand; 
} 

td.hover 
{ 
width:100%; 
height:18px; 
background-color:#999; 
border-width:1px; 
border-style:solid; 
border-color:#999; 
font-family:Tahoma, Verdana; 
font-size:11px; 
color:#fff; 
text-align:left; 
padding-left:11px;
style-DISPLAY: block  width:100%;
 
cursor:hand; 

}
```

Vielleicht mach ich ja was Verkehrt.


----------



## Fabian H (9. Juni 2004)

Nein, ich glaub, du hast da was falsch verstanden.

Nicht die Tabellenzelle muss diese CSS Eigenschaften haben, sondern der *Link*,
der in der Zelle ist.

Also diese Zeile hier raus:

```
style-DISPLAY: block  width:100%;
```
Und stattdessen z.B. so dem Link zuweisen:

```
td a {
  display: block;
  width: 100%;
}
```


----------



## xony (9. Juni 2004)

mHHHHH Komisch Komisch:

Hier mal der komplette Quellcode der css und der HTML Ausgabe:

CSS:

td.normal 
{ 
display: block;
width:100%; 
height:18px; 
background-color:#ccc; 
border-width:1px; 
border-style:solid; 
border-color:#ccc; 
font-family:Tahoma, Verdana; 
font-size:11px; 
color:#fff; 
padding-left:11px; 


cursor:hand; 
}

td.hover 
{ 
display: block;
width:100%; 
height:18px; 
background-color:#999; 
border-width:1px; 
border-style:solid; 
border-color:#999; 
font-family:Tahoma, Verdana; 
font-size:11px; 
color:#fff; 
text-align:left; 
padding-left:11px;


cursor:hand; 

} 


Und hier die HTML Ausgabe:

<tr>
  <td class="normal"
         onMouseOver="this.className='hover';"
         onMouseOut="this.className='normal';"> &nbsp;<img src="images/bullet.gif" border="0"><a href="<?php echo tep_href_link(FILENAME_DEFAULT);?>" style="display:block:width:100%;">Home</a>
  </td>
</tr>


Leider geht nix, nur wenn man auf den Textlink klickt .


----------



## xony (9. Juni 2004)

OK jetzt klappt es.
Allerdings sobald ich eine Grafik vor den Link setze (siehe Quellcode oben) verschiebt es sich um eine Zeile.
Ohne Grafik funktioniert es einwandfrei.


----------

