Zoomer une image avec les CSS
Bonsoir à toutes et à tous,
J'ai besoin de zoomer des images au passage de la souris et le j'ai des soucis
j'ai en css ce code :
Code:
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
| img {border: 0}
.thumb {
display:block;
margin:1px;
width:135px;
height:99px;
background-color:#D3D3D3;
float:left;
}
.thumb a {
display:block;
}
.thumb a:hover {
position:absolute;
}
body>.thumb a:hover { /*hack pour permettre le rollover de gauche à droite avec mozilla*/
position:relative;
}
.thumb a img {
margin:0;
padding:0;
width:135px;
height:99px;
}
.thumb a:hover img {
position:relative;
left:0px;
top:80px;
width:500px;
height:399px;
}
--> |
et en html ce code:
Code:
1
2
3
4
| <div style="text-align:center"><div class="thumb"><a href="#"><img src="image/Constellation du Taureaup.jpg " TITLE="Constellation du Taureau"/></A></div>
div class="thumb"><a href="#"><img src="image/Constellation du Cygnep.jpg" TITLE="Constellation du Cygne"/></A></div>
<div class="thumb"><a href="#"><img src="image/Galaxie M33p.jpg" TITLE="Galaxie M33"/></A></div>
<div class="thumb"><a href="#"><img src="image/La grande Oursep.jpg" TITLE="La grande Ourse"/></A></div></DIV> |
je recontre deux soucis, le premier vient du fait que je n'arrive pas a centrer mes quatre images sur la ligne, ça tire sur la gauche malgrès <div style="text-align:center">!!!
mon deuxième soucis est que j'ai en dessous une autre serie de quatre images et je n'arrive pas à répéter l'opération sur l'autre ligne !!! malgrès l'ouverture d'une balise div et sa fermeture sur la ligne, et l'ouverture d'une autre div sur la deuxième ligne
merci par avance pour votre aide
amicalement
scoubi77
