salut à tous,
je réalise mon site web et avant de le mettre en ligne ma page d´accueil, je voulais le tester sur mes navigateurs: mozilla furefox (last version), ie6 et ie7. Sur ie6 et 7, la page d´accueil s´affiche correctement mais sous firefox, non.
j´ai mis la page en ligne pour que vous puissiez voir de quoi je veux parler:
http://membres.lycos.fr/djoper2/
essayer sur ie6 (ou 7) puis sur mozilla, vous verez ce qui cloche.
j´ai réalisé cette page en (x)html qui se réfère à une page css pour le style.
voici le code source du fichier html: (je l´ai réduit pour pas s´y perdre.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>Accueil - Bienvenue sur mon site</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="design.css" />
<link href="design.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="header"></div>
<div class="contenuhaut"></div>
<div class="conteneurcontenu">
<h1>Présentation</h1>
<p>Salut à tous et bienvenue sur mon site web. Celui-ci n´est que mon deuxième et ne sera donc pas très perfectionné, même si plus esthétique que le premier ^^. <br />J´ai créé ce site dans le but premier d´en faire mon blog (j´aime pas trop le système de skyblog et on peut faire beaucoup plus de choses avec un vrai site.).<br/>Bonne visite.</p>
</div>
<div class="contenubas"></div>
et voici le fichier css:
body
{
color: white;
width: 760px;
margin: auto;
margin-top: 20px; /* Pour éviter de coller avec le haut de la fenêtre du navigateur. Essayez d´enlever pour voir ! */
margin-bottom: 20px; /* Idem pour le bas du navigateur */
background-image: url("images/fond.gif"); /* Une petite image de fond pour éviter d´avoir un vieux fond blanc :p */
}
.contenuhaut
{
background-image:url(´images/hautcontenu.gif´); /* URL de l´image de fond */
background-repeat:no-repeat; /* On interdit la reproduction de l´image de fond */
width: 578px ;
height: 40px ;
margin-left:10%;
margin-bottom: 0px ;
margin-top: 20px;
padding-bottom: 0px ;
background-repeat:no-repeat;
}
.contenubas
{
width: 580px ;
height: 40px ;
margin-left:10%;
margin-top: 0px ;
margin-bottom:20px;
padding-top: 0px ;
background-image:url("images/bascontenu.gif");
background-repeat:no-repeat;
}
.conteneurcontenu
{
width: 570px;
margin-left:10%;
margin-top: 0px;
margin-bottom: 0px;
padding-top:0px;
padding-bottom: 0px;
border-left: white 2px solid;
border-right: white 2px solid;
}
pourriez vous me dire pourquoi les bordures droites et gauches de "conteneurcontenu" ne touchent pas les images "hautcontenu.gif et bascontenu.gif" ?
Merci d´avance pour vos réponses.