Come si ottiene un tag di ancoraggio per riempire la larghezza di una cella di tabella?

Question

Ho una cella di tabella con un tag di ancoraggio e voglio la larghezza (e l'altezza) del tag di ancoraggio per riempire la larghezza della cella della tabella contenente. L'intuizione non sembra funzionare su questo. Per favore aiuto.

HTML:

<table> 
    <tr> 
     <td class="width_is_100px"> 
      <a href="http://www.doesnotwork.com"><span class="make_width_100px">Some Text</span></a> 
     </td> 
    </tr> 
</table> 

CSS: (non funziona)

.make_width_100px { 
    width:100px !important; 
} 

Il tag di ancoraggio è solo grande come il testo "Un testo". Voglio che l'utente sia in grado di cliccare ovunque all'interno della cella della tabella e attivare il collegamento. No javascript per favore.

Answer 1

Provalo:

a { 
    display: block; 
    height: 100%;   
    width: 100%; 
} 

Answer 2

Fai la tua <a> elemento un elemento di blocco (è in linea per impostazione predefinita):

.width_is_100px a { 
    display:block; 
} 

Answer 3

<table> 
    <tr> 
     <td class="width_is_100px"> 
      <a href="http://www.doesnotwork.com"><div style="width:100%;">Some Text</div></a> 
     </td> 
    </tr> 
</table> 

Answer 4

questo è probabilmente troppo tardi, ma, questo ha lavorato per me in tavoli con altezza del contenuto diversa.

html

<table class="example"> 
    <tr> 
     <td><a href="">small content</a></td> 
     <td><a href="">multiline<br>content</a></td> 
    <tr> 
</table> 

css

table{ 
    padding:10px; /*for example*/ 
} 
table.example td{ 
    overflow:hidden; 
    padding:0px; /*you can need !important*/ 
} 
table.example a{ 
    display: block; 
    height: 100%; 
    width: 100%; 
    padding: 10px 10px 500px 10px; /*table default padding except on bottom 500px for example*/ 
    margin-bottom: -490px; /*same as bottom padding - table padding*/ 
}