28173 sujets

CSS et mise en forme, CSS3

bonjour les gens, je voudrais faire une div vide qui est a l'interieur d'un lien. le but etant de faire une zone reactive sur ma page web. tout se passe nikel sous FF mais sur ce putin de IE , le lien n'est pas présent. Je suis obligé de donner un background coloré a ma div pour que IE voit une zone de lien.

je sais ca a l'air venu de la quatrieme dimension mais je comprend pas d'ou ca peut venir.

voici mon lien dans le code:

<a href="index.htm"><div id="index"></div></a>


et voici la css:

#index{
width: 80px;
position: absolute;
height: 80px;
top: 0px;
left: 0px;
background: red;
}


merci d'avance Smiley bawling
Et pourquoi pas
#index{

width: 80px;

display:block;

position: absolute;

height: 80px;

background: red;

}


<a href="" id="index">...</a>


Block, c'est plus fort que tout Smiley cligne
justement l'ami, le probleme c'est que je ne veux pas de ce background rouge mais que si je l'enleve, bah on dirait que la balise n'existe plus.
Bonjour,
Pour avoir la main qui apparait, tu dois avoir un lien
ou au moins un diese:
<a href="#" id="index">...</a>


Ensuite tu n'as pas besoin de mettre un display:block puisque tous les élément en position absolue le sont déjà:

#index{
position: absolute;
top: 0;
left: 0;
width: 80px;
height: 80px;
}

Modifié par Hermann (16 Jun 2006 - 19:04)
c'est un bug d'IE meme avec <a href="">.
La combine pour le faire appliquer ce lien sans reel backgrond :
background: url(transparent.gif);
Salut,

Sk4pis0 a écrit :
bonjour les gens, je voudrais faire une div vide qui est a l'interieur d'un lien. le but etant de faire une zone reactive sur ma page web.

<a href="index.htm"><div id="index"></div></a>




ça tu ne peux absolument pas le faire. l'élément a est de type inline et l'élément div de type block. Un élément inline ne doit pas contenir d'élément de type block (et on parle bien de type et non de comportement css).

Un petit exemple de solution css que je met en ligne :
http://clb56.freezee.org/conteneur_lien.php

Tu pourras y jeter un oeil quand mon hébergeur arrêtera d'avoir le serveur qui zone complètement Smiley decu
en attendant voici le code de l'exemple que j'avais construit :
html

<div id="div_lien">
                    <h2>Zone active</h2>
                    <p>
                         Comme vous pouvez vous en rendre compte au survol de la souris, toute cette zone est un lien.
                    </p>
                    <p>
                         Vous pouvez consulter les explications ci dessous pour voir comment cela est réalisé grace aux propriétés de style
                    </p>
                    <p>
                         L'activation de ce lien vous ramènera à la page d'accueil du site.
                    </p>
                    <a href="/">Retour à la page d'accueil</a>
                </div>


css

#div_lien {
             position:relative;
             width:400px;
             height:15.5em;/* hauteur déterminée empiriquement en fonction du contenu */
             padding:10px;
             border:1px solid #5f5;
             background:#dfd;
             }
             #div_lien a {
             display:block;
             position:absolute;
             top:0;
             left:0;
             width:100%;
             height:100%;
             font-size:1px;
             color:#dfd;
             text-decoration:none;
             background:url(bg_big_a.gif);/* image transparente de 5px sur 5px */
             }
JE pense que le fait de rajouter un background à l'objet, force cet objet à avoir un layout (http://www.satzansatz.de/cssd/onhavinglayout.html)
je preconise plutôt l'utilisation de zoom:1 qui force aussi le layout sans rien toucher au visuel
Modifié par Gatsu35 (17 Jun 2006 - 22:54)