Partage

Couleurs différentes sur ma page web selon le pc

8 janvier 2018 à 14:16:03

Bonjour ,

je resollicite votre aide sur un autre problème aujourd'hui car je ne comprend pas , ma page web se charge sur mon pc sur chrome avec certains hover en blanc comme je le veut , mais sur internet explorer ils sont bleu.

mais en plus , sur un autre pc sur chrome ou explorer il est en bleu quand même !

Avez vous déjà eu a faire a un cas similaire ? et si oui comment le résoudre?( si besoin du code je le fournirais mais vu que c'est long je préfère qu'on me le demande si besoin est)

merci d'avance :)

Vous êtes demandeur·se d'emploi ?
Sans diplôme post-bac ?

Devenez Développeur·se web junior

Je postule
Formation
courte
Financée
à 100%
8 janvier 2018 à 14:17:18

Hello,

AlexandreStefanini a écrit:

si besoin du code je le fournirais mais vu que c'est long je préfère qu'on me le demande si besoin est)

Besoin est :)

Essaie de vider ton cache quand tu appliques des modifs au CSS aussi ;)

8 janvier 2018 à 14:24:27

https://drive.google.com/open?id=1YvFdPwEVWTta3owckC-Ife9dBd06TADq

je vous donne le tout c'est encore le plus simple , et j'ai deja vider le cache de chrome et explorer

8 janvier 2018 à 14:27:10

Oula, ça fait un trop la :)

T'as pas une version test en ligne ? Ou juste le code correspondant ?

8 janvier 2018 à 14:39:30

Salut,

Quelle version d'Internet Explorer ? Tu testes en local ou en ligne ? T'es-tu bien assuré que tu n'étais pas en mode de compatibilité ?

Il n'y a pas de mauvais navigateur, il n'y a que du mauvais code !
8 janvier 2018 à 14:40:00

rhooManu a écrit:

Salut,

Quelle version d'Internet Explorer ? Tu testes en local ou en ligne ? T'es-tu bien assuré que tu n'étais pas en mode de compatibilité ?


je teste en local en ouvrant ma page web directement par le fichier html de l'explorateur, et j'ai le meme probleme avec chrome et explorer sur un autre pc alors que sur le mien seul explorer n'arrive pas a afficher ce que je lui demande( version 41.16299.15.0)

MrChampy a écrit:

Oula, ça fait un trop la :)

T'as pas une version test en ligne ? Ou juste le code correspondant ?


ça correspond a une partie de l'entete et une partie du pied de page , ça va prendre beaucoup de place^^

-
Edité par Ed win 8 janvier 2018 à 14:42:56

8 janvier 2018 à 14:53:49

C'est pas grave, ce sera plus pratique pour nous même avec un pavé de code que si tu mets le dossier entier :)

8 janvier 2018 à 15:06:15

du coup je vous met tout le html concerné et le css avec les :hover :

<!--Menu nav bleu marine contact presse numero + menu nav logo titre menu deroulant-->
	<header>
	<nav>
		<div class="navhaut">
			<div class="texte">
				<div>
			<img src="structure/ico_mail.jpg" class="ico">
			<a href="#" class="a">contact@ilm.fr</a>
			<img src="structure/ico_tel.jpg" class="ico">
			<a href="#" class="a">06 56 53 54 52</a>
			<img src="structure/picto_rse2.png" class="ico">
			<a href="#" class="a">RSE</a> 
				</div>
			<div class="menu">
				<a href="#" class="a">CATALOGUE</a>
			<a href="#" class="a">CONTACT</a>
			<a href="#" class="a">RECRUTEMENT</a>
			<a href="#" class="a">PRESSE</a>
			</div>
			
			<div class="langue">
				<p class="a">FR ou EN</p>
			</div>
			
			<div class="reseaux">
				<a href="#"><img src="structure/ico_fb.png" class="rsx"></a>
			<a href="#"><img src="structure/ico_g+.png" class="rsx"></a>
			<a href="#"><img src="structure/ico_twitter.png" class="rsx"></a>
			</div>
			
		</div>
		</div>
		<div class="navtitre">
			<div class="titre">
			<img src="structure/logo.png" id="ilm">
			<div class="accueil">
				<div class="menu">
			<img src="structure/ico_home.png" id="ico_home">
			<a href="#" class="a">ILM</a>
			<a href="#" class="a">STRUCTURES LUMINEUSES</a>
			<a href="#" class="a">REFERENCES</a>
			<a href="#" class="a">ACTUALITES</a>
			<form method="post" action=".php">
				<input type="text" name="Rechercher" placeholder="Rechercher">
			</form>
		</div>
		</div>
		</div>
		</div>
	</nav>
	</header>

css:

a{
	
	text-decoration: none;
}
li
{
	list-style-type: none;
}

a:visited
{
	color: #778899;
}

.navhaut 
{
	background-color: #151a27;
	height: 45px;
	font-size: 12px;

}
	

.texte
{
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-left: 18%;
	padding-right: 18%;
	color: #778899;
}
.a:hover
{
	color: white;
}

.menu
{
	margin-left: 50px;
	display: flex;
}

.menu a
{
	margin-right: 25px;
}

.langue
{
	margin-left: -50px;
}

.ico
{
	width: 19px;
	height: 13px;
	padding-right: 10px;
	padding-left: 40px;
	margin-left: -20px;
}

.rsx
{
	width: 20px;
	height: 20px;
}

.h1
{
	color: #7B8EB2;
}

h1
{
	color: #223D7D;
	margin:auto;
	margin-top: 40px;
	text-align: center;
}

/*footer*/

footer

{
	color: white;
	background-color: #17264F;
}

.sep
{
	margin-left:19%;
	margin-right: 19%;
	display: flex;
	
}

.posi
{
	width: 12px;
	height: 12px;
}

.colonne
{

	border-right: 1px solid white;
}

.colonne, .colonne4

{
	width: 25%;
	padding-top: 25px;
	padding-left: 25px;
	padding-right: 25px;
	font-size: 0.6em;
}

footer p
{
	color: #C2D0F3;
	text-align: justify;
	font-size: 1.1em;
}

footer h2
{
	font-size: 1.2em;
	padding-bottom: 15px;
}

footer a:visited
{
	color: none;
}

footer h3
{
	color: white;
	font-size: 1em;
}




9 janvier 2018 à 20:12:59

Bonjour,

je n'ai toujours pas trouvé la solution a mon problème...

10 janvier 2018 à 9:05:08

Salut,

Première chose qui me choque dans ton CSS :

footer a:visited
{
    color: none;
}

La propriété color ne peut pas prendre la valeur none. Je t'invite à lire les spécifications de cette propriété ou à utiliser le validateur de CSS du W3C (https://jigsaw.w3.org/css-validator/#validate_by_input) pour vérifier cela.

Ensuite, des liens en bleu ça ressemble au style par défaut des liens hypertexte. Cela semble assez normal car tu n'appliques pas d'effet de survole à tous tes liens : 

.a:hover
{
    color: white;
}

Ton effet de hover sera uniquement les éléments qui portent la classe "a". 

Quels sont les liens qui n'ont pas le rendu souhaité ? Tu as vérifié si ces liens portent bien la bonne classe ?

-
Edité par Mewen_bzh 10 janvier 2018 à 9:09:15

Recherche l'avis de développeurs front : Devenir un meilleur dev front ?
10 janvier 2018 à 9:19:26

J'ai des étranges bug en collant ton code dans un fiddle mais pas dans mon IDE, quelqu'un d'autre a ce soucis ?
11 janvier 2018 à 22:38:04

Mewen_bzh a écrit:

Salut,

Première chose qui me choque dans ton CSS :

footer a:visited
{
    color: none;
}

La propriété color ne peut pas prendre la valeur none. Je t'invite à lire les spécifications de cette propriété ou à utiliser le validateur de CSS du W3C (https://jigsaw.w3.org/css-validator/#validate_by_input) pour vérifier cela.

Ensuite, des liens en bleu ça ressemble au style par défaut des liens hypertexte. Cela semble assez normal car tu n'appliques pas d'effet de survole à tous tes liens : 

.a:hover
{
    color: white;
}

Ton effet de hover sera uniquement les éléments qui portent la classe "a". 

Quels sont les liens qui n'ont pas le rendu souhaité ? Tu as vérifié si ces liens portent bien la bonne classe ?

-
Edité par Mewen_bzh hier à 9:09

ah le none je l'ai virer,

nan en fait je me suis planté... mes hover sont blanc de partout , tout fonctionne la dessus desolé , c'est la couleurs avant qu'on passe la souris dessus qui pose problème

11 janvier 2018 à 22:54:00

Et à quel moment tu définis dans le CSS cette fameuse "couleurs avant qu'on passe la souris dessus qui pose problème"? J'ai regardé rapidement et je n'ai rien vu dans ton code... 

Recherche l'avis de développeurs front : Devenir un meilleur dev front ?

Couleurs différentes sur ma page web selon le pc

× Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
  • Editeur
  • Markdown