Problème de superposition de texte et d'image (pour l'implémentation d'un zoom)

**SunDX** · 29/05/2008, 08h40

Bonjour si quelqu'un pouvais m'aider sa m'aiderais beaucoup !!
J'ai parcouru pas mal de forum déjà !! Mais j'ai beau tester beaucoup rien n'y fais...

Mon souci est avant tout un problème de superposition; j'ai utilisé une feuille de style CSS pour pouvoir créer un lien qui sert à zoomer sur une partie de l'image, le souci c'est que le zoom qui s'affiche est situé derrière du texte qui se chevauche alors que je souhaiterais mettre ce zoom au dessus !!!

Pour voir par vous meme: http://sundx.free.fr/
c'est directement en première page !!!

Merci encore de votre aide !!

Voici le code (la partie en bleu est celle que je veu mettre en arrière plan par rapport au reste)

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
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
<html>

<head>
<meta http-equiv="Content-Type"
content="text/html; charset=iso-8859-1">
<meta name="GENERATOR" content="Microsoft FrontPage Express 2.0">
<title></title>
<style type="text/css">
<!--
#image {
width : 370px;
height: 465px;
background: url(../cadre.png) top left no-repeat;
}
#screen {
float: left;
width : 190px;
height: 140px;
margin-left: 81px;
margin-top: 82px;
border: 0px dotted white;
z-index:100;
}
#screen:hover {
width : 800px;
height: 372px;
left: 0px;
top: 0px;
border: 1px dotted black;
background: url(../cadrebig.jpg) top left no-repeat;
z-index:100;
}
#text{
float: center;
z-index:50;
}
-->
</style>
</head>

<body bgcolor="#B0B0B0" text="#000000" link="#000000"
vlink="#000000" alink="#000000">
<div align="center"><center>

<table border="0" width="950">
    <tr>
        <td><p align="center">



<div style="display: none;"><img alt="" src="../cadrebig.jpg"></div>
<div id="image">
	<a id="screen" href="#" title="Zoom"></a>
</div>


</p>
        </td>
        <td align="center" valign="top"><div id="text" align="center"><center><table
        border="0" width="500">
            <tr>
                <td align="center"><img src="prognewz.png"
                width="231" height="136"><hr width="80%">
                </td>
            </tr>
            <tr>
                <td align="center"><div id="text" align="center"><center><table
                border="0" cellpadding="5" cellspacing="0"
                width="90%" class="borders">
                    <tr>
                        <td align="center" bgcolor="#EEEEEE"><p
                        align="left"><font size="3"><em><strong>Le
                        27 Mai 2008</strong></em></font></p>
                        <p><font size="3"><em>Quelques petit
                        changement de Design pour la rapidité
                        de chargement du site</em></font></p>
                        <p><font size="3"><em>Remise en forme du
                        Pack Photo 2007</em></font></p>
                        <p align="right"><font size="3"><em><strong>Sun.</strong></em></font></p>
                        </td>
                    </tr>
                </table>
                </center></div></td>
            </tr>
            <tr>
                <td align="center"><hr width="80%">
                </td>
            </tr>
        </table>
        </center></div></td>
    </tr>
</table>
</center>
</body>
</html>

**kendyan** · 02/06/2008, 01h19

Code :

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

1
2
3
4
5
6
7
8
9
10
screen {
float: left;
width : 190px;
height: 140px;
margin-left: 81px;
margin-top: 82px;
border: 0px dotted white;
z-index:100;
overflow:hidden;
}

jai juste ajouté l'overflow

**SunDX** · 02/06/2008, 14h29

Merci beaucoup pour votre réponse, mon problème est régler !! Merci encore; heureusement qu'il ya des forum comme ca pour trouver des solutions et de l'entraide !!!

Problème de superposition de texte et d'image (pour l'implémentation d'un zoom)

CSS

Discussions similaires

Partager

Partager