Rendre un block cliquable

**elmessoussi** · 14/07/2008, 17h07

Bonjour,

Je possède un bloc contenant 2 liens, un text et une image :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<div style="styleBloc">
  <table>
    <tr>
      <td align="center"> 
	  	<a href="http://www.google.com">
			lien1		
		</a>	  
	  </td>
    </tr>
    <tr>
      <td align="center">
	  	<a href="http://www.google.com">
			<img src="img1.jpg" />
		</a>
	  </td>
    </tr>
  </table>
</div>

avec

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
<style type="text/css">
div.styleBloc {
	display: block;
	border-top:2px solid #CCCCCC;	
             border-bottom:2px solid #CCCCCC;
             border-left:1px solid #828282;
             border-right:1px solid #828282;
}
div.styleBloc a {
	display: block;
}
</style>

Bon et alors, qu'est ce que tu veux ?

Tout simplement, je veux que tout le div soit cliquable et renvoi vers le lien souhaité, le display: block; dans un th fonctionne correctement, mais là je doit le faire dans un div (ou span ou n'importe quel solution qui me permettra de rendre tout le tableau cliquable)

Merci d'avance pour vos réponse.

Essam

**FraK** · 15/07/2008, 09h05

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<head>
<style type="text/css">
div.styleBloc {
	display: block;
	border-top:2px solid #CCCCCC;	
             border-bottom:2px solid #CCCCCC;
             border-left:1px solid #828282;
             border-right:1px solid #828282;
}
a.styleBloc {
	display: block;
}
 
a.styleBloc:hover {
	display: block;
}
</style>
</head>
 
<body>
<div style="styleBloc">
  <table>
    <tr>
      <td align="center"> 
	  	<a href="http://www.google.com" class="styleBloc">
			lien1		</a>	  </td>
    </tr>
    <tr>
      <td align="center">
	  	<a href="http://www.google.com" class="styleBloc">
			<img src="img1.jpg" />
		</a>
	  </td>
    </tr>
  </table>
</div>
</body>

Rendre un block cliquable

CSS

Vue hybride

Discussions similaires

Partager

Partager