Rechercher : dans
Par :

[css]Bannière et margin-top

Dernière réponse le 13 mai 2007 à 16:03:26 mateus2, le 26 nov 2005 à 14:07:32 
 Signaler ce message aux modérateurs

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

Meilleures réponses pour « [css]Bannière et margin top » dans :
Les CSS pour présenter vos images VoirPour présenter agréablement vos images, vous pouvez intégrer quelques codes supplémentaires dans votre CSS et vous en servir à bon escient. Elles sont bien sur modulables en fonction de la charte graphique de votre site. Utilisation Mettez les codes...
[CSS] Créer facilement des CSS VoirUn outil très facile d'utilisation pour créer des CSS, avec un aperçu en direct de ce que vous créez : TopStyle. La version Lite est gratuite. www.topstyle4.com
Enlever le soulignement sous les liens en HTML/CSS VoirPar défaut, les liens hypertextes en HTML sont soulignés, un trait de la couleur du lien apparaît en dessous du texte. Il est possible de supprimer ce soulignement à l'aide de la propriété CSS text-decoration:none : Grâce au CSS Grâce au CSS via...
Les feuilles de style VoirPropriétés de polices Propriété Valeur Description font-family Police précise (Arial, Times, Verdana) Famille (serif, sans-serif, fantasy, monospace, cursive) Définit un ou plusieurs nom de polices ou de familles de...
Les classes de style (CSS) VoirLes classes et les ID Les classes Il peut s'avérer intéressant d'affecter des styles différents à des mêmes balises. Pour cela les spécifications CSS ont introduit le concept de classe. La définition des classes est aussi simple que celles des...
Feuilles de style - CSS VoirPrésentation des feuilles de style Le concept de feuilles de style est apparu en 1996 avec la publication par le W3C d'une nouvelle recommandation intitulée « Cascading StyleSheets » (feuilles de style en cascade), notée CSS. Le principe des...

1

mateus2, le 26 nov 2005 à 14:44:20

Ok c bon problème résolus tout seul comme un grand !

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

Répondre à mateus2

2

qwer, le 27 nov 2005 à 09:02:26

La position absloue est pas necessaire

body{
margin:0px auto;
padding:0px;
}

Répondre à qwer

3

mateus2, le 30 nov 2005 à 19:18:52

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

Répondre à mateus2

4

qwer, le 1 déc 2005 à 16:50:47

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

Répondre à qwer

5

mateus2, le 1 déc 2005 à 20:07:51

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 ?

Répondre à mateus2

6

 qwer, le 4 déc 2005 à 08:53:49

C'est le h1 qui te fais le margin

h1
{
background-color:green;
margin:0px;
}

Répondre à qwer