Bonjour à tous,
J'ai une marge qui apparait sous IE sous un site que je viens de finir. Sous FF tout se passe bien, pas de marge. Voici une adresse pour voir le problème :
http://www.webthea.com/demopacktheatre2/spip.php?page=saison
Voici les css :
Et oui, j'ai tout fait pour avoir les margins et les padding à 0 (enfin, je crois). Il y a des redondances je crois.
J'ai lu quelque part une solution avec un display: inline;, ça supprime bien la marge, mais ça colle le site à gauche...
Pour le code source de la page en html, je pense que les gens capablent de m'aider savent afficher le code source d'une page html avec un navigateur. En fait, c'est surtout pour éviter d'avoir un message trop long. Mais il le faut, je le mettrai.
D'avance, merci de votre aide !
J'ai une marge qui apparait sous IE sous un site que je viens de finir. Sous FF tout se passe bien, pas de marge. Voici une adresse pour voir le problème :
http://www.webthea.com/demopacktheatre2/spip.php?page=saison
Voici les css :
body{
background-color: #B9B9B9;
margin: 0px;
padding: 0px;
text-align: center;
font-family: Tahoma, Verdana, Arial;
color: #FFFFFF;
}
*{
margin: 0px;
padding: 0px;
}
html{
margin: 0px;
padding: 0px;
}
img {
vertical-align:bottom; /* remove extra space under the image */
float: left;
border: none;
}
#cache{
position: absolute;
left: 0px;
top: -5000px;
}
#global{
margin-left: auto;
margin-right: auto;
text-align: left;
width: 999px;
display: block;
}
a{
color: #e9b929;
text-decoration: none;
}
a:hover{
color: #FFFFFF;
}
a.mentions_legales{
font-size: 12px;
font-weight: bold;
color: #5e210b;
margin-right: 20px;
margin-left: 20px;
text-decoration: none;
position: relative;
}
a.mentions_legales:hover{
text-decoration: underline;
}
#pied{
clear: both;
float: left;
height: 200px;
width: 999px;
}
#mentions_legales{
margin-top: 20px;
background-image: url(../img/sommaire/bg-mentions-legales.gif);
clear: both;
float: left;
height: 25px;
width: 999px;
text-align: center;
padding-top: 3px;
}
/* Calendrier */
table.calendrier{
width: 250px;
text-align: center;
}
caption.calendrier{
font-size: 14px;
font-weight: bold;
}
/* Spectacle ThickBox 2 */
.fond_tb
{
position:absolute;
top:0;
left:0;
width:100%;
height:1500px;
background-color:#000000;
z-index:1;
filter:alpha(opacity=65);
-moz-opacity: 0.65;
opacity: 0.65;
display:none;
}
a.fermer_tb{
font-size: 10px;
clear: both;
float: right;
color: #e9b929;
text-decoration: none;
margin-bottom: 10px;
}
a.fermer_tb:hover{
color: #FFFFFF;
}
.formulaire_conteneur {
position:absolute;
top:0;
left:0;
width:100%;
height:1500px;
z-index:2;
position: absolute;
display: none;
text-align: center;
}
.formulaire_boite{
width: 450px;
margin-right: auto;
margin-left: auto;
background-color: #660000;
padding: 20px;
text-align: left;
margin-top: 20px;
}
.calendrier_boite{
width: 250px;
margin-right: auto;
margin-left: auto;
background-color: #660000;
padding: 20px;
text-align: left;
margin-top: 20px;
}
h3.titre_form{
font-size: 16px;
font-weight: bold;
clear: both;
margin-bottom: 10px;
}
form.form_haut{
margin: 0px;
padding: 0px;
clear: both;
float: left;
}
input.form_haut{
background-color: #FFFFFF;
clear: both;
float: left;
width: 200px;
padding-top: 2px;
padding-right: 5px;
padding-bottom: 2px;
padding-left: 5px;
margin-top: 5px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}
div.img_form_haut{
margin: 0px;
padding: 0px;
clear: both;
float: left;
width: 210px;
}
input.img_form_haut{
padding: 0px;
clear: both;
float: right;
margin-top: 5px;
margin-right: -3px;
margin-bottom: 0px;
margin-left: 0px;
}
div.pousseur{
clear:both;
}
#site{
background-image:url(../img/bg/bg-autre.png);
background-color: #9e181b;
width: 999px;
float: left;
background-repeat: no-repeat;
margin: 0px;
padding: 0px;
}
#entete{
clear: both;
float: left;
height: 287px;
}
#saison{
background-image: url(../img/saison/bg-saison-saison.png);
height: 287px;
width: 211px;
float: left;
}
#centre{
clear: both;
float: left;
width: 999px;
}
img.titre_saison{
margin-top: 13px;
}
#contenu_principal{
width: 768px;
float: left;
margin-top: 30px;
margin-left: 20px;
}
div.conteneur_spectacle{
width: 224px;
height: 210px;
float: left;
margin-right: 25px;
text-align: center;
}
img.vignette_spectacle{
margin-bottom:8px;
}
a.titre_spectacle{
font-size: 14px;
font-weight: bold;
color: #FFFFFF;
text-decoration: none;
}
a.titre_spectacle:hover{
text-decoration: underline;
}
#menu_haut{
float: left;
margin-left: 412px;
height: 220px;
width: 375px;
}
a.rechercher{
background-image: url(../img/menu-haut/menu-haut-rechercher-0.png);
float: left;
height: 59px;
width: 136px;
}
a.rechercher:hover{
background-image: url(../img/menu-haut/menu-haut-rechercher-1.png);
}
a.calendrier{
background-image: url(../img/menu-haut/menu-haut-calendrier-0.png);
float: left;
height: 59px;
width: 135px;
}
a.calendrier:hover{
background-image: url(../img/menu-haut/menu-haut-calendrier-1.png);
}
img.menu_haut_3{
float: left;
}
a.newsletter{
background-image: url(../img/menu-haut/menu-haut-newsletter-0.png);
float: right;
height: 102px;
width: 159px;
}
a.newsletter:hover{
background-image: url(../img/menu-haut/menu-haut-newsletter-1.png);
}
#menu_genre{
float: left;
height: 25px;
width: 600px;
text-align: center;
}
a.menu_genre{
color: #5e210b;
font-size: 18px;
font-weight: bold;
text-decoration: none;
margin-right: 15px;
margin-left: 15px;
}
a.menu_genre:hover{
text-decoration: underline;
}
#menu_mois{
float: left;
width: 480px;
padding-right: 60px;
padding-left: 60px;
}
a.menu_mois{
color: #5e210b;
font-size: 14px;
font-weight: bold;
text-decoration: none;
text-align: center;
width: 80px;
float: left;
margin-bottom: 3px;
}
a.menu_mois:hover{
text-decoration: underline;
}
#menu_principal{
float: left;
height: 358px;
width: 211px;
}
#menu_principal_1{
float: left;
}
a.accueil{
background-image: url(../img/sommaire/menu-principal-accueil-0.gif);
height: 67px;
width: 211px;
float: left;
}
a.accueil:hover{
background-image: url(../img/sommaire/menu-principal-accueil-1.gif);
}
a.theatre{
background-image: url(../img/sommaire/menu-principal-theatre-0.gif);
height: 63px;
width: 211px;
float: left;
}
a.theatre:hover{
background-image: url(../img/sommaire/menu-principal-theatre-1.gif);
}
a.saison{
background-image: url(../img/sommaire/menu-principal-saison-0.gif);
height: 65px;
width: 211px;
float: left;
}
a.saison:hover{
background-image: url(../img/sommaire/menu-principal-saison-1.gif);
}
a.billeterie{
background-image: url(../img/sommaire/menu-principal-billeterie-0.gif);
height: 63px;
width: 211px;
float: left;
}
a.billeterie:hover{
background-image: url(../img/sommaire/menu-principal-billeterie-1.gif);
}
a.archives{
background-image: url(../img/sommaire/menu-principal-archives-0.gif);
height: 63px;
width: 211px;
float: left;
}
a.archives:hover{
background-image: url(../img/sommaire/menu-principal-archives-1.gif);
}
#menu_principal_2{
float: left;
}
Et oui, j'ai tout fait pour avoir les margins et les padding à 0 (enfin, je crois). Il y a des redondances je crois.
J'ai lu quelque part une solution avec un display: inline;, ça supprime bien la marge, mais ça colle le site à gauche...
Pour le code source de la page en html, je pense que les gens capablent de m'aider savent afficher le code source d'une page html avec un navigateur. En fait, c'est surtout pour éviter d'avoir un message trop long. Mais il le faut, je le mettrai.
D'avance, merci de votre aide !