28173 sujets

CSS et mise en forme, CSS3

Couleur de texte et couleur de soulignement différentes pour un lien a

Bonsoir à tous,

Est il possible, sur un lien, d'afficher ce lien en rouge lorsque l'on passe dessus et de le souligner en blanc en même temp.

Merci
Modifié par yaya0057 (09 Dec 2006 - 22:24)
Modérateur
Bonsoir et bienvenue yaya0057, Smiley smile

oui tout à fait... en mettant une bordure inférieure à la place du text-decoration.

PS: Peux-tu éditer ton titre comme précisé dans la FAQ afin de le rendre plus explicite car, comme tu t'en doutes, tout le monde a des problèmes CSS sur ce salon. Merci d'avance. Smiley cligne
Modifié par koala64 (09 Dec 2006 - 21:12)
Merci pour ta réponse.

J'ai essayé, cela fonctionne correctement sous FIREFOX mais pas sous IE.
Si tu as une idée.
Par contre qu'entends tu par plus explicite et à quelle niveau.

Cordialement
yaya0057 a écrit :
J'ai essayé, cela fonctionne correctement sous FIREFOX mais pas sous IE.

Qu'as-tu essayé exactement (code HTML et CSS) ?

yaya0057 a écrit :
Par contre qu'entends tu par plus explicite et à quelle niveau.

Ton sujet s'intitule « CSS ». La réponse au problème intitulé « CSS », c'est un lien vers la spécification CSS 2.1 du W3C, et bonne chance pour te dépatouiller avec...

Comme je suppose que tu souhaites une aide plus précise et plus ciblée, il serait donc utile d'avoir un titre plus explicite.

En l'occurence, quelque chose comme « Couleur de texte et couleur de soulignement différentes pour un lien au survol » aurait été pas mal.
Ok,
Bien compris, dorénavant mes titres seront plus explicite et je te remercie de ta bienveillance.
Voilà le code qui me pose problème mais juste sous IE

 
a:hover {
	border-bottom:		1px solid white;
	color: 			red;
	font-family: 		Century, Serif;
	font-size: 		12px;
}


Ceci est le code css du lien sur lequel le hover fonctionne:

.menutext_2 {
	color:		white;
	height:		18px;
	float:		left;
	font-family:	Century, Serif;
	margin-bottom:	auto;
             margin-left: 	5px;
	margin-right:	5px;
             margin-top: 	10px;
	text-align:	center;
	width:		50px;
}

car sous FIREFOX quand je passe sur mon lien le text apparait en rouge et la bordure apparait en blanc par contre sous IE la bordure n'apparait pas.
Modifié par mpop (09 Dec 2006 - 22:26)
Désolé yaya0057, mais j'ai essayé de faire une page de test avec le code que tu donnes, et je ne suis arrivé à rien de concluant (ça fait un truc très très bizarre si on copie-colle tes styles et qu'on les applique sur un simple lien tout seul dans un paragraphe...).

Tu n'aurais pas un code complet ou, mieux encore, une page de test en ligne reproduisant le problème ?
Voila le code de la page web


<div class="menutext_2"><a href="index.htm" accesskey="0" title="Triangle">Triangle</a></div>


et le code css et déjà dans la page

par contre si dans dans le a.hover on fait


border:			1px solid yellow;


on voit un rectangle sous FIREFOX et seule les bordures de gauche et de droite apparaissent sous IE.


Merci
Modifié par yaya0057 (09 Dec 2006 - 22:54)
Là encore, c'est limité... avec la cascade CSS (et l'héritage des propriétés), il peut y avoir des « parasitages » qui viennent du reste du code. Et certains problèmes peuvent venir des autres éléments HTML de la page.

Donc, une petite page de test en ligne ?...
En attendant la mise en ligne. Un autre souci.
Voilà le code de mon css en entier

/*
 * BODY
 */
body {
	background-color:#CCCCCC;
	border:#CC66CC 3px solid;
	margin:0px;
	padding:0px;
}

/*
 * PARAGRAPHES
 */

#titre {
	background-color:white;
	color:black;
	font-family:Arial, Serif;
	font-size:30px;
	height:114px;
	margin-left:338px;
	margin-right:0px;
             margin-top:0px;
	text-align:center;
	padding-top:40px;	
	word-spacing:20px;
}

/*
* MENU PRINCIPAL
*/
.menu {
             background-color:green;	
             float:left;
             font-family:Century, Serif;
	font-size:12px;
	margin-bottom:0px;
	margin-left:0px;
	margin-right:0px;
             margin-top:0px;
  	height:40px;
	width:100%;
}


Et voici le code html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
		<link href="style/style1.css" rel="stylesheet" type="text/css" />
	</head>
	<body>
	
	<!-- BANNIERE -->
		<div id="titre">
			Formes géométriques<br />2D ~ 3D
		</div>

		<!-- MENU -->
		<div class="menu"></div>
            </body>
</html>


Il y a un souci entre IE et FIREFOX.
Comment puis faire pour éliminer la marge violette qui, sous IE, descend plus ba s que sur FIREFOX.

Cela sera tous pour ce soir. Je vais au dodo
Mais merci d'avance pour vos réponse
Sujet clos
Aller à