[css]Bannière et margin-top

bonjour,
voici mon porblème:

je veux que ma bannière soit collé en haut au navigateur. voici mon code :

/* FEUILLE DE STYLE */

body{
margin:auto;
background-color:#D4D4D4;
width:800px;
}
/* STYLE DE LA BANNIERE */
#ban{
background-image:url(images/banniere.jpg);
background-repeat:no-repeat;
width:780px;
height:149px;
}

je précise que sous IE ma bannière est centré et collé alors que sous mozilla, il y a un écart entre le navigateur et ma bannière.

comment puis je y remédier pour que mozilla ne me laisse plus cet écart ?

merci

6 réponses

  1. c'est le h1 qui te fais le margin

    h1
    {
    background-color:green;
    margin:0px;
    }
    1. ok çà marche impec merci qwer.

      J'avais encore un autre problème que je n'arrive pas à résoudre:

      En fait j'ai deux div dans mon code et en fait il y a un margin qui vient s'ajouter entre mes 2 div. dans mon div"contenu"si je met que ma police sans aucune balises alors les 2 div se collent. Ce margin est certainement générés par les balises de ma div "contenu". Voici mon code XHTML:

      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
      <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
      <head>
      <link rel="stylesheet" href="style2.css"/>
      <title> Mon CV </title>
      <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>
      </head>

      <body>

      <div id="banniere">
      </div>

      <div id="contenu">

      <h1>blablabla</h1>

      <ul>
      <li>blablablablablabla</li>
      <li>blablablablablabla</li>
      <li>blablablablablabla</li>
      <li>blablablablablabla</li>
      <li>blablablablablabla</li>
      </ul>

      </div>

      </body>
      </html>

      et voici ma feuille de style associés:

      body{
      width:780px;
      margin:auto;
      }

      #banniere{
      width:780px;
      height:146px;
      background-color:red;
      }
      #contenu{
      margin:0px;
      padding:0px;
      background-color:yellow;

      }

      voilà pouvez vous m'aider sur ce problème ?
      1. body{
        margin:0px;
        padding:0px;
        text-align:center;
        }

        #ban{
        background-image:url(images/banniere.jpg);
        background-repeat:no-repeat;
        background-position:0px 0px;
        width:780px;
        height:149px;
        margin:0px auto;
        padding:0px;
        }

        mais ta banniere c'est quoi ? un iframe ou un div, si c'est un iframe ca marchera pas avec ce code

        tu as mis #ban donc c'est bien <div id="ban" et pas class, attention le css est sensible a la casse
        1. Je viens de tester ton code qwer et j'ai toujours ce meme problème sur mozilla. Pour une fois IE ne m'embete pas.

          Que puis-je faire pour caler ma bannière sans margin-top sur mozilla ?

          merci
          1. la position absloue est pas necessaire

            body{
            margin:0px auto;
            padding:0px;
            }
            1. ok c bon problème résolus tout seul comme un grand !

              j'ai placé ma bannière en absolu.