Sujet Précédent Sujet Suivant

Problème d'affichage IE / Firefox

Résolu/Fermé
Eria - 18 juin 2008 à 11:17
bg62 Messages postés 23596 Date d'inscription samedi 22 octobre 2005 Statut Modérateur Dernière intervention 10 mai 2024 - 20 juin 2008 à 11:10
Bonjour,
Je suis en train de faire un site internet. J'ai créé des "boîtes" <div> pour positionner les différents éléments de ma page : l'en-tête, le menu, le coprs de page et le pied de page. Mais je rencontre un problème pour les positionner... Dans le but de mettre un fond d'écran par la suite, j'ai souhaité regrouper toutes ces boites dans une boite plus grande que j'ai appelé le "contenu", de taille fixe et centrée au milieu de la page.
Voici le code XHTML et le fichier CSS que j'ai utilisé :

<body>
<div id="contenu">

<!-- En-tête -->
<div id="header">
<?php include("include/header.php"); ?>
</div>

<!-- Menu -->
<div id="menu">
<?php include("include/menu.php"); ?>
</div>

<!-- Corps de la page -->
<div id="corps">

</div>


<!-- Pied de page -->
<div id="pied">
<?php include("include/pied.php"); ?>
</div>

</div> <!-- fin du <div> contenu -->
</body>


Dans les include il n'y a que du texte pour le moment...

html, body {
height: 100%;
margin: 0;
padding: 0;
}

body {
width: 100%;
margin-top: 5px;
margin-bottom: 5px;
}

#contenu {
width: 800px;
height: 100%;
margin: auto;
padding: 0;
border: solid red 1px;
}

/* ============================================ */
/* EN-TETE */
/* ============================================ */

#header {
border: solid 1px;
width: 100%;
height: 140px;
text-align: center;
background-color: white;
}


/* ============================================ */
/* MENU */
/* ============================================ */

#menu {
width: 20%;
border: solid green 1px;
padding: 10px;
float: left;
}


/* ============================================ */
/* CORPS DE LA PAGE */
/* ============================================ */

#corps {
width: 72.3%;

J'ai été obligé de mettre un nombre si tordu à cause du padding. J'ai l'impression que les marges intérieures aggrandissent la taille du bloc. C'est assez dur à gérer d'ailleur. Si quelqu'un connait un moyen de pas être embêté par ça, je suis preneur !
position: absolute;
top: 148px;
border: solid blue 1px;
padding: 20px;
}

/* ============================================ */
/* PIED DE PAGE */
/* ============================================ */

#pied {
width: 100%;
height: 20px;
padding-top: 5px;
padding-bottom: 5px;
border: solid purple 1px;
}

J'ai mis des bordures colorées dans un premier temps pour bien voir ce qui se passe. Et voici donc le résultat qe j'obtiens sur les deux navigateurs :

http://img511.imageshack.us/img511/4482/problmemm2.jpg

Que les deux ne fassent pas la même chose, je ne sais pas d'où ça vient mais je peux comprendre... par contre que le menu "sorte" du contenu ça me fait très bizarre, je comprend pas pourquoi ça fait ça sous Firefox.

Le problème vient surement du float qui n'est aps compris de la même manière par les deux navigateurs. Je voudrais trouver un moyen de ne pas l'utiliser, d'autant que j'aurai besoin par la suite de mettre un "height: 100%;" sur le menu, et je ne suis pas sûr que le float le permette...

En gros, comment faire le résultat de gauche sur l'image sur les deux navigateurs, sans utiliser de float ? J'ai cherché en vain toute la journée d'hier et j'en ai un peu marre de trainer sur ce problème.
Merci d'avance,
Eria
A voir également:

2 réponses

Réponse 1 / 2
Eria Messages postés 18 Date d'inscription samedi 12 mars 2005 Statut Membre Dernière intervention 8 avril 2009
20 juin 2008 à 08:52
Vu l'affluence des réponses pour me porter secours, je me suis débrouillé autrement...
Merci quand même.
0
Réponse 2 / 2
bg62 Messages postés 23596 Date d'inscription samedi 22 octobre 2005 Statut Modérateur Dernière intervention 10 mai 2024 2 363
20 juin 2008 à 11:10
c'est sur qu'une question semblable, plus avec un 'anonyme' ça ne doit pas affoler les gens !
merci de t'être inscrit en tous cas
et tant mieux si tu as trouvé tes réponses
on peut donc mettre en résolu ...
b g
0

Discussions similaires

Prélèvement Google Ireland Limited
jaffa1961 -
gill34051 -

32 réponses
Facture de google 380€ !
Misternet -
okapi -

61 réponses
adele
marine carnet-pantier -
irongege -

2 réponses
Arnaque frauduleuse Ireland ltd
Mymy -
celine -

3 réponses
Leboncoin : j'ai un problème d'affichage
maria1508 -
msi123 -

5 réponses