Problème de transparence

On voit a travers un bloc

Sujet résolu

28 février 2006 à 19:19:57

Salut a tous, je me suis lancé dans la construction d'un site et je voulais faire un système de menu horizontal où quand on survole un lien du menu, un div s'affiche.

je vais vous donner une partie du code.

ce code se trouve dans l'id menu

<span class="surp"><a href="blog.php">Blog</a>
<div id="sous_menu_blog"><p>Rien de nouveaux</p></div>
</span>

#menu #sous_menu_blog a
{
background: #e0e5ff;
border:none;
margin: 0px;
padding: 0px;
color: blue;
}

#menu #sous_menu_blog .souslien
{
background: #e0e5ff;
width: 98%;
border: solid 1px blue;
text-align: center;
padding: 0px;
}

#menu #sous_menu_blog p
{
background: #e0e5ff;
text-align:center;
margin: 2px;
}
#menu #sous_menu_blog
{
background: #e0e5ff;
display: none;
border: solid 2px #869dff;
width: 150px;
position: absolute;
margin-top: -1px;
left: 91px;
}

#menu .surp:hover>#sous_menu_blog
{
background: #e0e5ff;
display: block;
}

il y a une partie qui modifie l'apparence du lien (a) qui ne sert a rien pour le moment car j'ai écris "rien de nouveau" en attendant de mettre des liens a la place.

Mon problème est que quand il y a du texte en dessou du bloc qui apparais, on voit le texte a travers et d'une part c'est moche et d'autre part le curseur va se fofiller en dessou du bloc ce qui va le faire disparaitre alors que je ne voulais pas.

j'ai fait un test sur une autre page avec les codes suivant :

<span class="surp"><a href="qer">COUCOU</a>
<div id="bleu">
<a href="eoriuj">c'est moi</a>
</div></span>
<p>
ceci est un texte pour verifier si on ne voit pas a travers mon bloc ceci est un texte pour verifier si on ne voit pas a travers mon blocceci est un texte pour verifier si on ne voit pas a travers mon blocceci est un texte pour verifier si on ne voit pas a travers mon blocceci est un texte pour verifier si on ne voit pas a travers mon blocceci est un texte pour verifier si on ne voit pas a travers mon blocceci est un texte pour verifier si on ne voit pas a travers mon blocceci est un texte pour verifier si on ne voit pas a travers mon blocceci est un texte pour verifier si on ne voit pas a travers mon blocceci est un texte pour verifier si on ne voit pas a travers mon bloc</p>

body/*le corp des pages */
{
width : 760px;
padding : 20px;
background: #e0e5ff;
}

p
{
text-align:left;
}

.surp:hover>#bleu
{
display: block;
}

#bleu
{
display: none;
border: solid 2px #869dff;
width: 150px;
position: absolute;
top: 300px;
margin: 100px;
background: #e0e5ff;
margin-top: -1px;
left: 253px;
}

et là tout marche nikel

je ne comprend pas. quelqu'un peut m'aider??? :euh:

strucky

28 février 2006 à 19:31:51

Salut,

Je n'ai pas vraiment compris.

T'as pas une page en ligne pour que l'on visualise l'effet ?

Par contre un <p> et un <div> dans un <span> , ce n'est pas correct (blocks dans inline).

Mico

28 février 2006 à 22:28:22

voilà une vapture ecran du bug, je n'ai pas mis en ligne le site le le construit entièrement avant.
dans ce cas c'est peut etre un problème de type line dans les bloc.
là le problème est hestétique mais en meme temps, le sous menu (où il y a ecris logiciel etc...) se referme si le curseur n'est pas sur un lien (alors qu'il devrait rester si je le met n'importe ou sur le div.

merci

Hawks

1 mars 2006 à 2:42:40

Mets une couleur de fond à ton sous menu, ça évitera le double affichage...

Mico

1 mars 2006 à 9:59:06

justemment j'en ai mis partout pour eviter ça et ça ne marche pas.

Mico

8 mars 2006 à 13:45:48

bon, je n'ai pas résolut ce problème, en fait c'est dû au fait qu'il y a un bloc (div) en dessou de mes sous menus (qui s'affichent si il y a un hover sur le titre). il faudrais que je mette ces sous menu en premier plan, il n'y a pas un moyen???

Mico

9 mars 2006 à 18:55:42

Personne???

Mico

11 mars 2006 à 14:35:59

c'est bon j'ai trouver une solution. il suffisais de trouver une formule css pour mettre le menu au premer plan

z–index: 100;

plus la valeur est elevé plus le block est au premier plan. j'ai mis 100 pour etre sur qu'il est au premier plan.

En tout cas merci.