Bonjour , voila je creer mon premier site pour raconter l'histoire de mes personnes dans un jeu vidéo .
je me fais donc une sorte de site internet avec les infos que j'ai trouver sur le net et dans d'autres fichiers .
Voici donc mon probleme . Mon site marche sous IE mais sous FF il est completement deformé .
Voici en image , ce sera probablement plus compréhensible .
Attention , les images sont en resolution 1680x1050 pixels
Le site se trouve ici .
http://tekmatok.free.fr/
Le site sous Internet Explorer .
http://tekmatok.free.fr/fichiers/le.site.sous.ie.jpg
Le site sous Firefox .
http://tekmatok.free.fr/fichiers/le.site.sous.ff.jpg
J'ai aussi mis en ligne mes fichiers css et pages ici .
http://tekmatok.free.fr/fichiers/site.perso.rar
Ou si vous preferez , voici les fichiers CSS .
Fichier general.css
<style type="text/css"> <!-- /*GENERAL*/ body { margin: 0px;/* sans marges, la page sera collée aux bords */ font-family: verdana, arial, sans-serif; /* on définit la police de base dans la page */ font-size: 0.8em; /* on définit la taille de police de base dans la page. em est une unité qui tient compte des préférences de l'utilisateur (0.8em, préférence moyenne =12px env.) */ background-color: #FFFFFF; text-align: justify; } /*Titres*/ h1 { font-size: 140%; text-align: left; padding:0; margin:0; } h2 { font-size: 100%; text-align: left; margin:0; padding:0; line-height:normal; } h3 { font-size: 100%; text-align: left; margin:0; padding:0; line-height:normal; } /*---------*/ ul, li{ margin-left: 8; margin-bottom: 10; padding:0; line-height: 0px; /* interligne */ } p { text-align: justify; line-height: normal; font-size: 100%; } a { font-weight: bold; color: #00005F; /*#00005F=bleu foncé*/ text-decoration: none; /* "none" pour éviter le soulignement au survol */ } dt{ font size: 120%; text-align: left; margin-top:10px; padding:0; line-height:normal; } dd{ font size: 100%; text-align: left; margin-left:10px; line-height:normal; } /*GENERAL FIN*/ /*----------------------*/ --> </style>
Fichier structure.css
<style type="text/css"> <!-- /*BLOC DE DROITE*/ .droite { position: absolute; margin:0px; padding:0px; right:0px; /* on place le bloc droit à droite en position absolue */ top: 0px; width: 180px; height:470px; } /*MENU DEBUT*/ .menu { /* on définit un conteneur pour le menu qui se trouve dans le bloc droite */ margin-top:10px; margin-bottom:10px; margin-right:0px; margin-left: 0px; padding-right: 1px; padding-top: 2px; padding-bottom: 2px; padding-left: 0px; border: 1px solid #000000; font-family: verdana, arial; font-size: 75%; text-align: left; line-height: normal; } .menu a{ font-weight: normal; color: 060C6F; text-decoration: none; /* pour éviter le soulignement au survol */ } .menu ul, li{ margin-left: 8; margin-bottom: 10; padding:0; line-height: normal; } .menu h2{ font-size: 110%; text-align: center; margin:0; padding:0; line-height:normal; } .menu tr,td{ font-size: 70%; margin:0; padding:0; line-height:normal; } /*MENU FIN*/ /*BLOC DE DROITE FIN*/ /*----------------------*/ /*BLOC CENTRE*/ .centre { margin-right: 180px; /* on place le bloc centre par rapport à la largeur du bloc droit */ margin-top: 0px; height:100%; } .centre ul,li{ margin: 10; padding:5px; line-height: normal; /* interligne */ } .centre h1 { background: #FFFFFF url(../image/cadreNewsTitreNoir.gif); background-repeat: repeat-x; } /*blocs à l'intérieur de CENTRE*/ .page { /* on définit un conteneur pour la news qui se trouve dans le bloc centre*/ border: 1px solid #000000; background-image: url(../images/fondlogo.gif); font-family: verdana, arial; font-size: 75%; text-align: justify; line-height: normal; padding: 3px; } .page ul, li { margin-left: 20; margin-right:0; margin-top:0; margin-bottom: 0; padding: 0; } /*BLOC CENTRE FIN*/ /*----------------------*/ --> </style>
Je vous remerci par avance pour votre aide .
