Pb positionnement corps dans IE
Résolu
Isobell
-
Isobell -
Isobell -
Bonjour,
Je tente tant bien que mal de créer un petit site. Je suis loin de l'avoir terminé et il y a un pb dont je ne parviens pas à trouver l'origine :
Lorsque j'affiche ma page dans IE le corps du texte passe sous les onglets (qui sont à gauche), alors que dans Mozilla par exemple il s'affiche correctement. Auriez-vous une solution svp ?
Merci d'avance pour votre aide. Tous vos conseils sont les bienvenus...
Ci-après le code :
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="fr-fr">
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<title>Acccueil</title>
<style type="text/css">
body {
margin: 20px auto;
width: 760px;
background-image: url(images/fond.png);
}
#en_tete {
height: 110px;
padding-left: 20px;
background-color: #ff6600;
width: 830px;
}
#menu {
float: left;
width: 120px;
font-family: Arial,Helvetica,sans-serif;
color: black;
margin-top: 20px;
}
.element_menu {
border: 2px solid black;
margin-bottom: 3px;
background-color: #ff6600;
font-family: Arial,"Arial Black","Times New Roman",Times,serif;
text-align: center;
font-size: x-small;
height: 20px;
padding-bottom: 1px;
padding-top: 3px;
width: 130px;
color: black;
}
#corps {
padding: 5px;
background-color: white;
margin-bottom: 10px;
margin-top: 20px;
font-family: "Times New Roman",Times,serif;
background-repeat: no-repeat;
background-position: center center;
background-image: url(../../../Nono/filet-5.jpg);
width: 690px;
margin-left: 150px;
height: 481px;
}
#pied_de_page {
padding-bottom: 5px;
clear: both;
text-align: center;
background-repeat: no-repeat;
background-position: center center;
background-color: #993300;
color: black;
width: 850px;
}
a {
color: black;
text-decoration: none;
}
.adresse {
text-align: center;
background-color: #ffff99;
height: 163px;
padding-right: 4px;
padding-left: 4px;
width: 120px;
color: black;
float: left;
margin-top: 45px;
}
</style>
</head>
<body style="color: rgb(0, 0, 0); background-color: rgb(153, 51, 0);"
alink="#000099" link="#000099" vlink="#990099">
<div style="text-align: left; height: 119px;" id="en_tete">
<big><big><big><br>
<small style="color: white;"></small></big></big></big></div>
<div style="color: black; font-weight: bold;" id="menu">
<div class="element_menu"><font size="-1"><a
href="page4.html">Accueil</a></font>
</div>
<div class="element_menu"><font size="-1"><a
href="page4.html">
</a></font><a href="page4.html"><big>Avantages</big><br>
</a></div>
<div class="element_menu">
<font size="-1"><a href="page4.html">Fonctionnement</a></font>
</div>
<div class="element_menu"><a href="page4.html">
<big>Prestations</big><br>
</a><font size="-1"><a href="page4.html"><br>
</a></font></div>
<div class="element_menu">
<font size="-1"><a href="page4.html">Transcription</a></font>
</div>
<div class="element_menu">
<font size="-1"><a href="page4.html">Tarifs</a></font>
</div>
<div class="element_menu">
<font size="-1"><a href="page4.html">Contact</a></font>
</div>
<div class="element_menu"><font size="-1"><a
href="page4.html"><acronym
title="Conditions Générales de Vente">CGV</acronym></a></font></div>
<div class="element_menu">
<font size="-1"><a href="page4.html">Mentions
légales</a></font>
</div>
<div style="font-weight: bold; margin-left: 0px; width: 126px;"
class="adresse"><small
style="font-family: Times New Roman;">
<font size="-1"><small><a href="page4.html"><br>
</a><br>
</small></font></small><small><font size="-1"><small><span
style="font-family: Times New Roman;"></span><br>
</small></font></small></div>
</div>
<div id="corps"><br>
<div style="text-align: center;"><br>
<small style="font-family: Times New Roman;"></small><span
style="font-family: Times New Roman;"></span></div>
</div>
<div style="margin-left: 150px; width: 701px; text-align: center;"
id="pied_de_page">Tous
droits
réservés - 2011 - </div>
</body>
</html>
Je tente tant bien que mal de créer un petit site. Je suis loin de l'avoir terminé et il y a un pb dont je ne parviens pas à trouver l'origine :
Lorsque j'affiche ma page dans IE le corps du texte passe sous les onglets (qui sont à gauche), alors que dans Mozilla par exemple il s'affiche correctement. Auriez-vous une solution svp ?
Merci d'avance pour votre aide. Tous vos conseils sont les bienvenus...
Ci-après le code :
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html lang="fr-fr">
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<title>Acccueil</title>
<style type="text/css">
body {
margin: 20px auto;
width: 760px;
background-image: url(images/fond.png);
}
#en_tete {
height: 110px;
padding-left: 20px;
background-color: #ff6600;
width: 830px;
}
#menu {
float: left;
width: 120px;
font-family: Arial,Helvetica,sans-serif;
color: black;
margin-top: 20px;
}
.element_menu {
border: 2px solid black;
margin-bottom: 3px;
background-color: #ff6600;
font-family: Arial,"Arial Black","Times New Roman",Times,serif;
text-align: center;
font-size: x-small;
height: 20px;
padding-bottom: 1px;
padding-top: 3px;
width: 130px;
color: black;
}
#corps {
padding: 5px;
background-color: white;
margin-bottom: 10px;
margin-top: 20px;
font-family: "Times New Roman",Times,serif;
background-repeat: no-repeat;
background-position: center center;
background-image: url(../../../Nono/filet-5.jpg);
width: 690px;
margin-left: 150px;
height: 481px;
}
#pied_de_page {
padding-bottom: 5px;
clear: both;
text-align: center;
background-repeat: no-repeat;
background-position: center center;
background-color: #993300;
color: black;
width: 850px;
}
a {
color: black;
text-decoration: none;
}
.adresse {
text-align: center;
background-color: #ffff99;
height: 163px;
padding-right: 4px;
padding-left: 4px;
width: 120px;
color: black;
float: left;
margin-top: 45px;
}
</style>
</head>
<body style="color: rgb(0, 0, 0); background-color: rgb(153, 51, 0);"
alink="#000099" link="#000099" vlink="#990099">
<div style="text-align: left; height: 119px;" id="en_tete">
<big><big><big><br>
<small style="color: white;"></small></big></big></big></div>
<div style="color: black; font-weight: bold;" id="menu">
<div class="element_menu"><font size="-1"><a
href="page4.html">Accueil</a></font>
</div>
<div class="element_menu"><font size="-1"><a
href="page4.html">
</a></font><a href="page4.html"><big>Avantages</big><br>
</a></div>
<div class="element_menu">
<font size="-1"><a href="page4.html">Fonctionnement</a></font>
</div>
<div class="element_menu"><a href="page4.html">
<big>Prestations</big><br>
</a><font size="-1"><a href="page4.html"><br>
</a></font></div>
<div class="element_menu">
<font size="-1"><a href="page4.html">Transcription</a></font>
</div>
<div class="element_menu">
<font size="-1"><a href="page4.html">Tarifs</a></font>
</div>
<div class="element_menu">
<font size="-1"><a href="page4.html">Contact</a></font>
</div>
<div class="element_menu"><font size="-1"><a
href="page4.html"><acronym
title="Conditions Générales de Vente">CGV</acronym></a></font></div>
<div class="element_menu">
<font size="-1"><a href="page4.html">Mentions
légales</a></font>
</div>
<div style="font-weight: bold; margin-left: 0px; width: 126px;"
class="adresse"><small
style="font-family: Times New Roman;">
<font size="-1"><small><a href="page4.html"><br>
</a><br>
</small></font></small><small><font size="-1"><small><span
style="font-family: Times New Roman;"></span><br>
</small></font></small></div>
</div>
<div id="corps"><br>
<div style="text-align: center;"><br>
<small style="font-family: Times New Roman;"></small><span
style="font-family: Times New Roman;"></span></div>
</div>
<div style="margin-left: 150px; width: 701px; text-align: center;"
id="pied_de_page">Tous
droits
réservés - 2011 - </div>
</body>
</html>
A voir également:
- Pb positionnement corps dans IE
- Logiciel positionnement gratuit - Guide
- Ie tab - Télécharger - Outils pour navigateurs
- Calibri corps - Forum Téléchargement
- Exemple test de positionnement greta - Forum Études / Formation High-Tech
- Formation secrétaire comptable niveau IV ✓ - Forum Études / Formation High-Tech
3 réponses
bonjour,
je pense qu'il faut insérer un div qui contient le menu et le corps du texte. Aussi il est préférable de créer un div qui englobe toute la page (c à dire sous la balise body.
tito
je pense qu'il faut insérer un div qui contient le menu et le corps du texte. Aussi il est préférable de créer un div qui englobe toute la page (c à dire sous la balise body.
tito
Merci beaucoup Tito ! Après avoir fait ce que tu m'as conseillé et avoir mis le corps en position absolue, je pense que c'est sur la bonne voie !
Seulement un autre pb se pose :
- Sur IE le pied de page est bien positionné avec la bonne marge sous le corps, le corps n'est plus sous les onglets et bien aligné avec ceux-ci mais il est décalé vers la droite.
- Sur Mozilla, le corps est parfaitement placé, mais c'est le pied de page qui est y collé (la marge n'est pas prise en compte)
C'est un truc à devenir cinglé...
Seulement un autre pb se pose :
- Sur IE le pied de page est bien positionné avec la bonne marge sous le corps, le corps n'est plus sous les onglets et bien aligné avec ceux-ci mais il est décalé vers la droite.
- Sur Mozilla, le corps est parfaitement placé, mais c'est le pied de page qui est y collé (la marge n'est pas prise en compte)
C'est un truc à devenir cinglé...
- Sur IE le pied de page est bien positionné avec la bonne marge sous le corps, le corps n'est plus sous les onglets et bien aligné avec ceux-ci mais il est décalé vers la droite. As tu essayé de jouer sur les margin ou padding?
- Sur Mozilla, le corps est parfaitement placé, mais c'est le pied de page qui est y collé (la marge n'est pas prise en compte) essais de modifier les margin?
si le problème persiste fais un copier coller de ton nouveau code.
tito
- Sur Mozilla, le corps est parfaitement placé, mais c'est le pied de page qui est y collé (la marge n'est pas prise en compte) essais de modifier les margin?
si le problème persiste fais un copier coller de ton nouveau code.
tito
Merci encore pour ton aide et ta réponse Tito !
Pour le pied de page le pb est reglé et à présent sur Mozilla tout est OK. Il reste seulement ce décalage du corps sur la droite dans IE ! (ça se joue à environ 50px)
Si je modifie le margin left du coup c'est dans Mozilla que ça ne va plus. Je ne m'y connais pas assez et du coup je ne sais pas comment pallier à ça...
Si jamais tu passes à nouveau par là ;)
Pour le pied de page le pb est reglé et à présent sur Mozilla tout est OK. Il reste seulement ce décalage du corps sur la droite dans IE ! (ça se joue à environ 50px)
Si je modifie le margin left du coup c'est dans Mozilla que ça ne va plus. Je ne m'y connais pas assez et du coup je ne sais pas comment pallier à ça...
Si jamais tu passes à nouveau par là ;)
