Script CSS multi navigateur

Fermé
soufiaane Messages postés 12 Date d'inscription samedi 12 décembre 2009 Statut Membre Dernière intervention 20 janvier 2011 - 5 janv. 2010 à 22:44
Atropa Messages postés 1940 Date d'inscription mercredi 25 juin 2008 Statut Membre Dernière intervention 11 mai 2014 - 6 janv. 2010 à 00:04
Bonjour, je travail sur un site
et bien sûr je rencontre des problème que j'attendais pas
au début je travaillai juste sur pour Firefox et après en le testant sur IE j'ai remarquer que ça ne fonction pas correctement comme je l'ai programmer (je parle toujours sur la partie design)
après une petite recherche j'ai trouver la solution qu'on peut mettre des test sur les navigateurs et on inclus le Css qui le correspondant ! (je travail donc sur Firefox, IE et Opera ) je crois que ce sont les navigateurs universelles
le problème qui me fait complètement beuguer c'est que chez moi ça marche très bien sur les 3 navigateurs mais en le testant ailleurs c'est encore du n'importe quoi >< et ça commence a m'énerve :/
(ba déjà je galère a placer les valises "DIV" correctement sur la page pour un seul navigateur u_u
ce que je demande c'est est ce qu'il y a une moyenne simple pour que ça fonction correctement n'importe ou ?
tout en réduisant le nombre des fichiers CSS ? est ce que quelqu'un a eu le même problème ? j'aimerai savoir comment le résoudre
et un grand merci a vous tous en avance

3 réponses

Atropa Messages postés 1940 Date d'inscription mercredi 25 juin 2008 Statut Membre Dernière intervention 11 mai 2014 274
5 janv. 2010 à 23:40
bonsoir,

le problème est très simple, ie c'est de la merde, il n'est pas compatible w3c.

perso sur mes site j'affiche une banderole au utilisateurs sous ie, les invitant à utiliser un navigateur compatible. Ce n'est pas les aider de les laisser utiliser une merde pareil !
surtout que les utilisateurs d'ie ne connaisse rien en informatique, sinon il ne l'utiliserait pas.
bien souvent il ne savent même pas que d'autres navigateurs existent et ils utilisent ça parce que c'est fourni avec leur os.

pour les navigateur n'oublis pas safari et chrome qui sont plus utilisé que opera...
après ce n'est pas vraiment un problème. ils sont compatibles, il n'y a donc besoin que d'un css pour eux tous appart pour quelques détails comme les border-radius qui ne sont pas prises en compte par opéra et pour les autres il faut des propriétés propriétaire.

par exemple pour faire un arrondi sur firefox safari et chrome et en prévoyant le css3:
border-radius: 15px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;


tu mets ça dans un seul fichier et tu auras le même rendu pour firefox safari et chrome

chrome et safari le rendu est le même étant donné qu'ils utilisent tout les deux webkit comme moteur web
firefox utilise gecko,
opéra utilise Presto.
ie utilise trident et c'est pourri

regarde ça : https://fr.wikipedia.org/wiki/Acid3
0
soufiaane Messages postés 12 Date d'inscription samedi 12 décembre 2009 Statut Membre Dernière intervention 20 janvier 2011
5 janv. 2010 à 23:49
merci pour ta réponse
et enfin c'est bien que tu la dis, je voulais pas parler comme ça pour question de politesse mais j'avoue IE c'est de la vraie merde
et sinon je tien a vous informer que je ne suis que débuteur
et si j'ai compris un truc c'est que c'est possible de faire un seul CSS et que mon site soit le même dans presque tout les navigateurs ?
j'aimerai des explications sur ça car j'ai pas vraiment bien compris
et surtout j'ai pas compris ton script ?
"border-radius: 15px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;"
je le met comme ça ?
merci
0
Atropa Messages postés 1940 Date d'inscription mercredi 25 juin 2008 Statut Membre Dernière intervention 11 mai 2014 274
6 janv. 2010 à 00:04
alors oui un seul css pour firefox safari chrome et opéra c'est possible si on s'y prend bien...

pour le javascript je ne connais pas bien opéra, a vrai dire j'ignore un peu ce navigateur

en fait il n'y a que ie qui fout la merde

essaie ça sur firefox, safari et chrome, puis sur opéra tu vas comprendre :

<!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>
	<title>Angle arrondi</title>
	<style type="text/css">
	#a1 {
		width : 200px;
		height: 200px;
		position : absolute;
		top : 50%;
		left: 50%;
		margin-top : -100px;
		margin-left: -100px;
		background-color: red;
		border-radius: 15px;
		-moz-border-radius: 15px;
		-webkit-border-radius: 15px;
	}
	</style>
</head>
<body>
	<div id="a1"></div>
</body>
</html>


border-radius c'est pour quand le css3 sera implémenté par les navigateur
-moz-border-radius c'est pour firefox
-webkit-border-radius c'est pour chrome et safari

regarde sur zonecss
https://www.zonecss.fr/

il faut toujours que le html soit compatible w3c et le css au maximum, je veux dire par là que par exemple tu ne peux pas encore faire d'arrondi en étant compatible.

http://validator.w3.org/ pour valider le html
http://jigsaw.w3.org/css-validator/ pour valider le css

sur firefox je te conseille d'utiliser html validator qui est très pratique !
il y a aussi web developer et firebug qui sont indispensable pour le développement !
0