Problème d'Overflow et d'ancres html
Bonjour,
J'ai un soucis avec mes liens ancre lorsque je déclare une div en overflow: hidden;
Le scroll ne se fait tout simplement plus.
voila ma css
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
| body {
margin: 0;
}
/*====================*/
/*=== Container ===*/
/*====================*/
#resize {
width: 1600px;
position: relative;
left: 50%;
margin-left: -800px;
overflow: hidden;
}
#wrapper {
width: 6810px;
height: 300px;
}
/*====================*/
/*=== Images ===*/
/*====================*/
.big {
float: left;
width: 454px;
z-index: 0;
}
.back {
float: right;
width: 448px;
position: absolute;
text-align:right;
z-index: 4;
} |
et mon html
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
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>à ciel ouvert - Tactio</title>
<link rel="stylesheet" href="css/objects.css" type="text/css" />
</head>
<body><a name="menu"></a>
<div id="resize">
<div id="wrapper">
<div class="big"><div class="back"><a href="#menu"><img src="img/back.png" border="0"/></a></div><a name="01"></a><a href="#02"><img src="img/tactio/01_big.jpg" border="0" alt=""/></a></div>
<div class="big"><div class="back"><a href="#menu"><img src="img/back.png" border="0"/></a></div><a name="02"></a><a href="#03"><img src="img/tactio/02_big.jpg" border="0" alt=""/></a></div>
<div class="big"><div class="back"><a href="#menu"><img src="img/back.png" border="0"/></a></div><a name="03"></a><a href="#04"><img src="img/tactio/03_big.jpg" border="0" alt=""/></a></div>
<div class="big"><div class="back"><a href="#menu"><img src="img/back.png" border="0"/></a></div><a name="04"></a><a href="#05"><img src="img/tactio/04_big.jpg" border="0" alt=""/></a></div>
<div class="big"><div class="back"><a href="#menu"><img src="img/back.png" border="0"/></a></div><a name="05"></a><a href="#06"><img src="img/tactio/05_big.jpg" border="0" alt=""/></a></div>
<div class="big"><div class="back"><a href="#menu"><img src="img/back.png" border="0"/></a></div><a name="06"></a><a href="#07"><img src="img/tactio/06_big.jpg" border="0" alt=""/></a></div>
<div class="big"><div class="back"><a href="#menu"><img src="img/back.png" border="0"/></a></div><a name="07"></a><a href="#08"><img src="img/tactio/07_big.jpg" border="0" alt=""/></a></div>
<div class="big"><div class="back"><a href="#menu"><img src="img/back.png" border="0"/></a></div><a name="08"></a><a href="#09"><img src="img/tactio/08_big.jpg" border="0" alt=""/></a></div>
<div class="big"><div class="back"><a href="#menu"><img src="img/back.png" border="0"/></a></div><a name="09"></a><a href="#10"><img src="img/tactio/09_big.jpg" border="0" alt=""/></a></div>
<div class="big"><div class="back"><a href="#menu"><img src="img/back.png" border="0"/></a></div><a name="10"></a><a href="#11"><img src="img/tactio/10_big.jpg" border="0" alt=""/></a></div>
<div class="big"><div class="back"><a href="#menu"><img src="img/back.png" border="0"/></a></div><a name="11"></a><a href="#12"><img src="img/tactio/11_big.jpg" border="0" alt=""/></a></div>
<div class="big"><div class="back"><a href="#menu"><img src="img/back.png" border="0"/></a></div><a name="12"></a><a href="#13"><img src="img/tactio/12_big.jpg" border="0" alt=""/></a></div>
<div class="big"><div class="back"><a href="#menu"><img src="img/back.png" border="0"/></a></div><a name="13"></a><a href="#14"><img src="img/tactio/13_big.jpg" border="0" alt=""/></a></div>
<div class="big"><div class="back"><a href="#menu"><img src="img/back.png" border="0"/></a></div><a name="14"></a><a href="#15"><img src="img/tactio/14_big.jpg" border="0" alt=""/></a></div>
<div class="big"><div class="back"><a href="#menu"><img src="img/back.png" border="0"/></a></div><a name="15"></a><a href="#15"><img src="img/tactio/15_big.jpg" border="0" alt=""/></a></div>
</div>
</div>
</body>
</html> |
la page est également publié ici :
http://www.acielouvert.net/scroller/scroller4.html
J'aimerais bien trouver la solution, je retourne le problème dans tout les sens.
