18100 sujets

Questions générales et questions de débutants

Apparition de texte à droite d'un autre texte lors de son survol

Bonjour,

j'ai tenté de faire un menu avec des ul li ul li, etc... car avant je ne faisais que des div, ce qui n'est pas bon !

J'ai juste un problème sur la mise en forme.
Du texte apparait lors du survol de mon bloc 'texte 1 à texte 4'. J'aimerais que ce texte apparaisse à droite de ce bloc.

Comment procéder ? J'ai essayé de jongler avec les float, position, etc... mais rien à faire...

Voici mon code :


<!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" xml:lang="fr">




	<head>
		<title>Site Industrie EAT</title>
	
		<meta http-equiv="Content-Language" content="fr">
    	<meta http-equiv="Content-Type" content="text/HTML; charset=iso-8859-1" />

	    <meta http-equiv="Content-style-type" content="text/css" />

<style type="text/css">


<!--


a {
text-decoration: none; /* définition du lien qui affichera le "calque" */
}

a:hover {
background: none; /* correction d'un bug IE */
}

a span { /* définition de la balise <span> inclue dans <a> */
display: none;
}

a:hover span { /* définition de la balise <span> au survol */
position : relative;
display: inline;
top: 0px; /* positions et dimensions du calque, que vous pouvez changer à loisir */
left: 0px;
background: blue;
text-align: center;
color: white;
}

ul li { /* toutes les listes auront un fond bleu */  
background: blue; 
display:inline;

} 
ul li ul li{ /* toutes les listes situé dans des listes auront un fond rouge */ 
background: red; 
} 

ul li ul li ul li{ /* toutes les listes situé dans des listes auront un fond vert */ 
background: green; 
} 


-->
</style>


	</head>


<body>



<div>
<ul>
	<li>Niveau 1
	    <ul>
        	<li>Niveau 2
		        <ul>
				<a href="#">Texte 1<br />Texte 2<br />Texte 3<br />Texte 4<br />
					<span>
						<li>Texte 1</li>
						<li>Texte 2</li>
					</span>
				</a>
		        </ul>
		</li>
	    </ul>
	</li>
	<li>Niveau 1
	    <ul>
        	<li>Niveau 2
		        <ul>
				<a href="#">Texte 1<br />Texte 2<br />Texte 3<br />Texte 4<br />
					<span>
						<li>Texte 1</li>
						<li>Texte 2</li>
					</span>
				</a>
		        </ul>
		</li>
	    </ul>
	</li>	<li>Niveau 1
	    <ul>
        	<li>Niveau 2
		        <ul>
				<a href="#">Texte 1<br />Texte 2<br />Texte 3<br />Texte 4<br />
					<span>
						<li>Texte 1</li>
						<li>Texte 2</li>
					</span>
				</a>
		        </ul>
		</li>
	    </ul>
	</li>
</ul>
</div>


</body>

</html>


Quelqu'un a une idée ?
Modifié par barthoose (13 Sep 2005 - 15:58)
Bonsoir,

merci de ta réponse, je cherche, je cherche, mais je commence sérieusement à désespérer.
Qu'est ce qui ne va pas dans ma page exactement ?
Sujet clos
Aller à