28234 sujets

CSS et mise en forme, CSS3

Problème de conflit avec la balise <span> [résolu]

Bonjour,
je me fait un site sur l'info,
http://artotal.nuxit.net/index.htm
et je cherche à faire un menu un peu comme alsacréation,
sa marche en local sur FF et IE, e, ligne FF mais pas IE ne l'ignore entièrement ???
un bout de code sera plus parlant.
le menu concérner se sont les trois boutons vert bleu mais sous FF vous pouvez voir l'effets rechercher.

la partie CSS2
.bulle{
	text-align:center;
	position: absolute;
	z-index: 100;
	line-height:22px;
	font-size: 100%;
	left: 102px;
	top: 280px;
	height: 19px;
	width: 51px;
}
.bulle a:link{
    color:#000;
    text-decoration:none;
}
.bulle a:visited{
	text-decoration:none;
	padding: 2px 0px 2px 0px;
	color: #000;
}
.bulle a:hover{
    margin-left:-6px;
	border: 1px inset #33ccff;
	color:#000;
	padding: 2px 10px 4px 15px;
	background-color:#33ccff;
	text-decoration:none;
}
.bullea{
	text-align:center;
	position: absolute;
	z-index: 100;
	line-height:22px;
	font-size: 100%;
	left: 95px;
	top: 431px;
	height: 19px;
	width: 67px;
	}
.bullea a:link{
    color:#000;
    text-decoration:none;
}
.bullea a:visited{
	text-decoration:none;
	padding: 2px 0px 2px 0px;
	color: #000;
}
.bullea a:hover{
		margin-left:-6px;
	border: 1px inset #33ccff;
	color:#000;
	padding: 2px 10px 4px 15px;
	background-color:#33ccff;
	text-decoration:none;
}
.bulleb{
text-align:center;
	position: absolute;
	z-index: 100;
	line-height:22px;
	font-size: 100%; 
	left: 96px;
	top: 581px;
	height: 21px;
	width: 66px;
}
.bulleb a:link{
    color:#000;
    text-decoration:none;
}
.bulleb a:visited{
	text-decoration:none;
	padding: 2px 0px 2px 0px;
	color: #000;
}
.bulleb a:hover{
	margin-left:-6px;
	border: 1px inset #33ccff;
	color:#000;
	padding: 2px 10px 4px 15px;
	background-color:#33ccff;
	text-decoration:none;
}
a span { 
display: none;
}
a:hover span { 
display: inline;
position: absolute;
margin-top: -80px; 
margin-left: -60px;
width: 100px;
height: 90px;
text-align: center;
line-height:16px;
color:#000;
font-size:12px;
font-family:Verdana, Arial, Helvetica, sans-serif,
}

La partie xhtml

<div class="bulle"><a href="tarifs.htm" title="prix attractifs" target="_self">tarifs<span>Pour un devis c'est gratuit contactez-nous <img src="images/courriel1.gif"> </span></a></div>
<div class="bullea"><a href="index.htm" title="page d'accueil" target="_self">accueil<span>Retour sur la page d'accueil</span></a></div>
<div class="bulleb"><a href="cv.htm" title="services proposés" target="_self">services<span>Votre service informatique pour particulier, PME et TPE</span></a></div>

Bien ami Smiley calm ent.
Modifié par xartotal (04 Mar 2005 - 13:55)
xartotal a écrit :
Eureka, c'était un conflit tout bete

Je ne vois pas comment mettre résolu dans le titre ? ¿ ? ¿ ? ¿ ? ¿
Merci.
Administrateur
xartotal a écrit :

Je ne vois pas comment mettre résolu dans le titre ? ¿ ? ¿ ? ¿ ? ¿
Merci.

Comme d'habitude, la FAQ, premier lien Smiley smile
Si tu préfères l'Aide, c'est expliqué aussi.
xartotal a écrit :
Bonjour,
je me fait un site sur l'info,
http://artotal.nuxit.net/index.htm
et je cherche à faire un menu un peu comme alsacréation,
sa marche en local sur FF et IE, e, ligne FF mais pas IE ne l'ignore entièrement ???
un bout de code sera plus parlant.
le menu concérner se sont les trois boutons vert bleu mais sous FF vous pouvez voir l'effets rechercher.

la partie CSS2
.bulle{
	text-align:center;
	position: absolute;
	z-index: 100;
	line-height:22px;
	font-size: 100%;
	left: 102px;
	top: 280px;
	height: 19px;
	width: 51px;
}
.bulle a:link{
    color:#000;
    text-decoration:none;
}
.bulle a:visited{
	text-decoration:none;
	padding: 2px 0px 2px 0px;
	color: #000;
}
.bulle a:hover{
    margin-left:-6px;
	border: 1px inset #33ccff;
	color:#000;
	padding: 2px 10px 4px 15px;
	background-color:#33ccff;
	text-decoration:none;
}
.bullea{
	text-align:center;
	position: absolute;
	z-index: 100;
	line-height:22px;
	font-size: 100%;
	left: 95px;
	top: 431px;
	height: 19px;
	width: 67px;
	}
.bullea a:link{
    color:#000;
    text-decoration:none;
}
.bullea a:visited{
	text-decoration:none;
	padding: 2px 0px 2px 0px;
	color: #000;
}
.bullea a:hover{
		margin-left:-6px;
	border: 1px inset #33ccff;
	color:#000;
	padding: 2px 10px 4px 15px;
	background-color:#33ccff;
	text-decoration:none;
}
.bulleb{
text-align:center;
	position: absolute;
	z-index: 100;
	line-height:22px;
	font-size: 100%; 
	left: 96px;
	top: 581px;
	height: 21px;
	width: 66px;
}
.bulleb a:link{
    color:#000;
    text-decoration:none;
}
.bulleb a:visited{
	text-decoration:none;
	padding: 2px 0px 2px 0px;
	color: #000;
}
.bulleb a:hover{
	margin-left:-6px;
	border: 1px inset #33ccff;
	color:#000;
	padding: 2px 10px 4px 15px;
	background-color:#33ccff;
	text-decoration:none;
}
a span { 
display: none;
}
a:hover span { 
display: inline;
position: absolute;
margin-top: -80px; 
margin-left: -60px;
width: 100px;
height: 90px;
text-align: center;
line-height:16px;
color:#000;
font-size:12px;
font-family:Verdana, Arial, Helvetica, sans-serif,
}

La partie xhtml

<div class="bulle"><a href="tarifs.htm" title="prix attractifs" target="_self">tarifs<span>Pour un devis c'est gratuit contactez-nous <img src="images/courriel1.gif"> </span></a></div>
<div class="bullea"><a href="index.htm" title="page d'accueil" target="_self">accueil<span>Retour sur la page d'accueil</span></a></div>
<div class="bulleb"><a href="cv.htm" title="services proposés" target="_self">services<span>Votre service informatique pour particulier, PME et TPE</span></a></div>

Bien ami Smiley calm ent.
C'est en haut à droite de ton post pour pouvoir déterminer quel est le post à éditer.
Ensuite tu te retrouveras en monde connu.
@xartotal
As-tu changé de navigateur/plate-forme ?
Si oui lequel/laquelle ?

Et merci de ne pas t'endormir sur la touche « ? » Smiley cligne
Modifié par Stephan (04 Mar 2005 - 21:51)
Sujet clos
Aller à