28173 sujets

CSS et mise en forme, CSS3

Bonjour,
après la tempete en bretagne c'est le soleil mais il fait tjs mauvais temps sur mon script......
j'ai un bouton image en le survolant, je fais apparaitre un menu avec des liens, quand je glisse la souris sur ce menu c'est tout bon... mais quand j'arrive à un endroit où se trouve en dessous (de ce menu) un champs texte avec un overflow: auto; le menu disparait c'est un problème que sur ff ??http://forum.alsacreations.com/smilies/biggol.gif
Smiley biggol si vous avez la solution ça m'aiderai bien merci
Administrateur
Hello et bienvenue ici Smiley smile

Comme tout le monde n'est pas devin, je te rappelle l'une des Règles que tu as dû survoler trop vite :
Règle 13 a écrit :
Enfin, n'hésitez pas à toujours fournir une image explicative et une url où les membres auront un aperçu de votre problème. La règle est simple : il faut toujours donner un maximum de détails pour être sûr d'avoir une chance que les autres comprennent et aident.
je suis ton conseil je test avec les balise code c'est une premierehttp://forum.alsacreations.com/smilies/lol.gif
Smiley lol
le html :
<div id="connexion_1">
<div class="acces_membre">
<ul>
<li><a class="drop" href="">MENU
<!--[if IE 7]><!-->
</a>
<!--<![endif]-->
<table><tr><td>
<form method="post" action="administration/login.php3">
	<ul>
	<li>Connectez vous</li>
	<li><a href="javascript:void(0)">Pseudo<br />
   <input type="text" name="pseudo" id="pseudo" class="champs" style="">
   </a></li>
	<li><a href="javascript:void(0)">Mot de passe<br />
	<input type="password" name="passe" id="passe" class="champs" style="">
	</a></li>
	<li><a href="javascript:void(0)">
	<input name="modif_infos" id="info_1" type="radio" name="modif_infos" value="1">Modifier vos infos
	</a></li>
	<li><a href="javascript:void(0)">
	<input name="modif_infos" id="info_2" type="radio" value="2" checked>Votre espace membre
	</a></li>
	<li><a href="">
	<input name="submit" type="submit" value="Connection" class= "connection" />
	</a></li>
	<li><a href="perdu.php3"><img src="" style="border-style: none; margin: 0px 5px 0px 0px"alt="" width="9" height="9" border="0" class="lien">Vous avez oublié votre mot de passe ?
	</a></li>
	</ul>
</form>
</td></tr></table>
<!--[if lte IE 6]>
</a>
<![endif]-->
</li>
</ul>
</div>
</div> 

<div id="conteneur_4">

<!-- TEXTE_ AVEC_ ACSENSEUR  -->
    <div id="bloc_texte">
      <p><i>Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.
	  Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.
	  Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.
	  Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.
	  Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.
	  Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.
	  Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.Que du blabla.</i></p>
  
	</div>

le css :
http://forum.alsacreations.com/smilies/eek.gif
Smiley eek
<style type="text/css">	
#conteneur_4 {
position:relative;
width : 710px;
height : 100px;
margin : 0px 0px 0px 10px;
background : transparent;
}
#bloc_texte {
position :absolute;
width : 407px;
height: 100px ;
overflow: auto;
padding :2px 5px 0px 5px;
border-bottom : 1px solid #cecece;
border-top : 2px solid #4a4a4a;
border-right : 1px solid #cecece;
border-left : 2px solid #4a4a4a;
background : #F6BA02;
color : purple;
}
#bloc_texte p {
margin-top: 0;    /* Là aussi, pas de marge au dessus du paragraphe */
font-family : "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
font-size : 12px;
font-weight : bold;
text-align: justify;
}

table {
margin:0; padding:0; border:0; 
border-collapse:collapse;
font-size:0px;
}

#connexion_1 {/*pseudo_passe */
position:absolute;
width : 45px;
height : 50px;
text-align : left;
margin :-10px 0px 0px 5px;
z-index:50;
}
.acces_membre {
position:absolute; 
font-family:helvetica,arial,sans serif;
margin-bottom:-20px;
color:#e0e0e0;/*gris*/
}
.acces_membre  li:hover  li {/*titre_menu_pour_ff */
color:#e0e0e0;/*gris*/
}
.acces_membre ul {
padding:0; 
margin:0;
list-style-type: none;
}
.acces_membre ul li {
position:relative;
float:left;
}
.acces_membre ul li a, .acces_membre ul li a:visited {
display:block; 
text-decoration:none; 
width:52px;
height:60px;
color:#e0e0e0;/*gris*/
font-size:16px;
font-weight:bold;
background:#ff6600/*paille*/ url() top left no-repeat; 
text-indent:-999px;
}
.acces_membre ul li ul {
visibility:hidden;
position:absolute;
width:180px;
font-size:16px;
font-weight:bold;
top:0; 
left:0;
border:2px solid purple;
margin: 0px 0px 0px 50px;/* decalage de la fenetre du bouton */
}
.acces_membre ul li:hover a {/* specifique pour autres que IE */
width:235px;
}
.acces_membre ul li a:hover {/* specifique pour IE */
width:235px;
}
.acces_membre ul li:hover ul {
visibility:visible;
}
.acces_membre ul li a:hover ul {/* specifique pour IE */
visibility:visible;
}
.acces_membre ul li:hover ul li a {
display:block; 
background : url();
text-indent:0;
color:purple;
font-weight:normal; 
font-size:12px;
font-weight : bold;
height:auto; 
line-height:1em; 
padding:5px; 
width:170px;
text-align:center;
}
.acces_membre ul li a:hover ul li a {/* specifique pour IE */
display:block; 
background : url();
border:0;
margin:0;
text-indent:0;
color:purple;
font-weight:normal; 
font-size:12px;
font-weight : bold;
height:auto; 
line-height:1em; 
padding:5px; 
width:170px;
text-align:center;
}
.acces_membre ul li:hover ul li a:hover {
background : url();
color:#ffffcc;/*paille*/
}
.acces_membre ul li a:hover ul li a:hover {/*specifique pour IE*/
background : url();
color:#ffffcc;/*paille*/
}
</style>

J'en mets peut etre un peu de trop ?
Modifié par marquito (23 May 2006 - 15:16)
Si tu pouvais mettre ton code en forme avec les balises "code".

En plus, c'est plus lisble. Smiley cligne

Merci.
Modifié par TheReverendEVIL (23 May 2006 - 14:58)