Problème compatibilité navigateurs
lylyD
Messages postés
3
Statut
Membre
-
lionel-DIL Messages postés 1222 Date d'inscription Statut Membre Dernière intervention -
lionel-DIL Messages postés 1222 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
Je viens de réaliser un code en html pour réaliser un template mail, et celui-ci s'affiche parfaitement sur chrome et safari, un peu sur firefox (traits bleus en plus) et pas du tout sur IE...
Le but de ce template et que le beaucoup de monde le voie, donc si il ne fonctionne pas sur IE...
Auriez-vous une idée de ce qui pourrait bloquer?
Je vous mets mon code:
<!DOCTYPE html>
<html>
<body>
<center>
<div style="width:600px; height:706px; position:relative; z-index:1;"><img src="up.jpg" alt="" /></div>
<div style="width:600px; height:625px; position:relative; z-index:2; top:-35px;"><img src="BG.png" alt="" /></div>
<div style="width:530px; height:100px; position:relative; z-index:3; top:-630px; text-align:justify;"> XXX</div>
<div style="position:relative; z-index:3; top:-630px; left:-1px;"><img src="bloc.jpg" alt="" /></div>
<div style="width:530px; height:100px; position:relative; z-index:3; top:-630px; text-align:justify;"> XXX</div>
<div style="width:30px; height:30px; position:relative; z-index:3; top:-630px; left:-225px;"><a href="http://www.facebook.com/><img src="facebook.jpg" alt="" /></div>
<div style=" width:30px; height:30px; position:relative; z-index:3; top:-660px; left:-165px; "><img src="twitter.jpg" alt="" /></div>
<div style= "width:30px; height:30px; position:relative; z-index:3; top:-690px; left:-106px; "><img src="linkedin.jpg" alt="" /></div>
<div style="width:600px; height:197px; position:relative; z-index:1;top:-705px;"><img src="footer.jpg" alt="" /></div>
</center>
</body>
</html>
Je ne m'y connais pas trop en html et je sais que là c'est super moche car je n'ai pas fait le CSS à part mais je dois tout faire sur une page...
Merci beaucoup pour votre aide!
Je viens de réaliser un code en html pour réaliser un template mail, et celui-ci s'affiche parfaitement sur chrome et safari, un peu sur firefox (traits bleus en plus) et pas du tout sur IE...
Le but de ce template et que le beaucoup de monde le voie, donc si il ne fonctionne pas sur IE...
Auriez-vous une idée de ce qui pourrait bloquer?
Je vous mets mon code:
<!DOCTYPE html>
<html>
<body>
<center>
<div style="width:600px; height:706px; position:relative; z-index:1;"><img src="up.jpg" alt="" /></div>
<div style="width:600px; height:625px; position:relative; z-index:2; top:-35px;"><img src="BG.png" alt="" /></div>
<div style="width:530px; height:100px; position:relative; z-index:3; top:-630px; text-align:justify;"> XXX</div>
<div style="position:relative; z-index:3; top:-630px; left:-1px;"><img src="bloc.jpg" alt="" /></div>
<div style="width:530px; height:100px; position:relative; z-index:3; top:-630px; text-align:justify;"> XXX</div>
<div style="width:30px; height:30px; position:relative; z-index:3; top:-630px; left:-225px;"><a href="http://www.facebook.com/><img src="facebook.jpg" alt="" /></div>
<div style=" width:30px; height:30px; position:relative; z-index:3; top:-660px; left:-165px; "><img src="twitter.jpg" alt="" /></div>
<div style= "width:30px; height:30px; position:relative; z-index:3; top:-690px; left:-106px; "><img src="linkedin.jpg" alt="" /></div>
<div style="width:600px; height:197px; position:relative; z-index:1;top:-705px;"><img src="footer.jpg" alt="" /></div>
</center>
</body>
</html>
Je ne m'y connais pas trop en html et je sais que là c'est super moche car je n'ai pas fait le CSS à part mais je dois tout faire sur une page...
Merci beaucoup pour votre aide!
A voir également:
- Problème compatibilité navigateurs
- Compatibilite windows 11 - Guide
- Pack compatibilité office 2003 - Télécharger - Bureautique
- Macos 14 compatibilité - Accueil - MacOS
- Compatibilité libreoffice et microsoft office - Guide
- Test de compatibilité prénom pourcentage - Forum Programmation
5 réponses
Bonjour,
Manque plein de choses : le head, quelques meta etc.
Le style doit être mis dans une feuille de style.
z-index:3; et top:-630px; sont assez dépréciés car interprétés différemment par les navigateurs.
Il faut mettre des tailles pour les images.
Manque plein de choses : le head, quelques meta etc.
Le style doit être mis dans une feuille de style.
z-index:3; et top:-630px; sont assez dépréciés car interprétés différemment par les navigateurs.
Il faut mettre des tailles pour les images.
Je ne cherche pas à faire une page internet, donc le titre et la description ne sont pas vraiment nécessaires, et quand je change <center> pour <<div style="text-align: center"> la moitié des éléments de ma page ne sont plus alignés...
Je ne suis pas sûre que ce soit la bonne solution...
Je ne suis pas sûre que ce soit la bonne solution...
Merci bien de ta réponse!
Quels sont les méta qui manquent?
Pour le style justement je ne peux pas le mettre sur une feuille de style car ce code sera ensuite chargé dans un logiciel où je ne peux mettre qu'une seule page...
Donc je rajoute un head, je mets des tailles pour les images, mais je fais comment pour remplasser les z-index et positions?
Quels sont les méta qui manquent?
Pour le style justement je ne peux pas le mettre sur une feuille de style car ce code sera ensuite chargé dans un logiciel où je ne peux mettre qu'une seule page...
Donc je rajoute un head, je mets des tailles pour les images, mais je fais comment pour remplasser les z-index et positions?
C'est avec les marges, padding etc. qu'il faut placer ses éléments, pas center.
Ok pour le titre, mais l'UTF 8 ou ISO, c'est un minimum
Ok pour le titre, mais l'UTF 8 ou ISO, c'est un minimum
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
Déjà :
<meta charset="utf-8" />
Le titre.
Éventuelle description.
pour remplacer les z index et autres trucs inutiles, il y a des margin, padding, des width, des height, float etc.
Sinon, rien ne sert de mettre un doctype d'HTML 5 si on fait de l'HTML dépassé.
La balise <center> est dépréciée aussi.
<div style="text-align: center"> pour remplacer.
<meta charset="utf-8" />
Le titre.
Éventuelle description.
pour remplacer les z index et autres trucs inutiles, il y a des margin, padding, des width, des height, float etc.
Sinon, rien ne sert de mettre un doctype d'HTML 5 si on fait de l'HTML dépassé.
La balise <center> est dépréciée aussi.
<div style="text-align: center"> pour remplacer.
