5568 sujets

Sémantique web et HTML

Espacements entre div - imcompréhension [résolu]

Bonjour,
problème maintes fois posé mais là je ne comprend pas d'où viens l'espacement entre mes deux div "haut_de_page" et "menu" Smiley fache .


<body>
<div id="all">

<div class="haut_de_page">
<img src="echo/logo_echo_graphik.jpg" width="489" height="89" /><img src="echo/light1.jpg" width="151" height="89"/><span class="menu_haut"></span>
</div>

<div class="menu"></div>

</div>
</body>




body{
background-color:#221305;
background-image:url(fond.jpg);
background-repeat:repeat-x;
margin:0;
text-align: center;
}

#all{
margin-left:auto;
margin-right:auto;
width:980px;
height:900px;
margin:0px;
  }
  
.haut_de_page{
text-align:center;
margin:0px;}

.menu_haut{
background-image:url(menu_light.jpg);
width:195px;
height:89px;}

.menu{
margin-top:0px;
background-image:url(bandeau_menu.jpg);
width:980px;
height:52px;}


j'ai beau mettre des margin 0 partout ça ne veu pas se coller. Smiley fache
Modifié par mackean (09 Sep 2008 - 11:01)
Bonjour,

Aurais-tu un exemple en ligne ou une capture d'écran pour que l'on puisse voir ce que tu souhaites obtenir ? Smiley rolleyes
Très peu (trop peu ?) d'information pour résoudre ton problème Smiley decu ... mais je tablerai bien sur un petit "vertical-align: bottom" sur la dite image. Smiley cligne

<edit>Attention à ton code, l'extrait que tu nous fournis contient quelques problèmes (éléments vides et utilisation inappropriée de propriétés css) ...</edit>
Modifié par yodaswii (08 Sep 2008 - 17:03)
lien vers le site

Oui mon code n'est pas du tout terminé et je suis conscient que mon code css n'est pas bon je men vais le modifier rapidement. Si tu pouvais m'en dire plus sur ce sujet je suis preneur.

Smiley smile

ce probleme n'apparait que sous IE.
Modifié par mackean (08 Sep 2008 - 17:15)
a écrit :
... mais je tablerai bien sur un petit "vertical-align: bottom" sur la dite image. Smiley cligne


Je confirme et je signe ! Smiley smile

Donc un petit .haut_de_page img { vertical-align: bottom; } fera l'affaire.

a écrit :
Oui mon code n'est pas du tout terminé et je suis conscient que mon code css n'est pas bon je men vais le modifier rapidement. Si tu pouvais m'en dire plus sur ce sujet je suis preneur.


Les différents tutoriels et articles de ce site devraient répondre à tes interrogations. Smiley cligne Au besoin, n'hésites pas à nous remonter les questions que tu pourrais encore te poser ... nous y répondrons avec plaisir. Smiley smile
merci a toi c'est ça Smiley smile .

a écrit :
Au besoin, n'hésites pas à nous remonter les questions que tu pourrais encore te poser ... nous y répondrons avec plaisir.


Une derniere question, Smiley biggrin , pourquoi cela ne se centre pas ni sur firefox ni sur google chrome alors que sous IE tout va bien ?
Bonsoir mackean,

mackean a écrit :
Une derniere question, Smiley biggrin , pourquoi cela ne se centre pas ni sur firefox ni sur google chrome alors que sous IE tout va bien ?

Dans ton cas de figure, le centrage devient assez simple via les marges latérales automatiques :

#all {
[#red]height:900px;[/#] A éviter, la hauteur devrait "se créer" d'elle même avec ton futur contenu [cligne] 
margin:0 auto; ([#blue]équivaut à -> margin: 0 auto 0 auto;[/#])
width:980px;
}


Ceci étant dit quelques erreurs qu'il conviendrait de corriger dès maintenant avant que ton travail ne soit trop avancé Smiley cligne
Pour paraphraser un certain lutin qui hante ce forum :
L'Elfe a écrit :
Le mieux serait peut-être de reprendre du début. Un petit tour sur cet article : Comment débuter et trouver l'information, ainsi que dans les Tutoriels et dans la FAQ devrait déjà bien t'informer sur les standards du web et la manière de faire un site conforme.

Il te manque surtout un Doctype et l'insertion de ta de feuille de styles n'est pas conforme Smiley ohwell
Une petite révision avec un arrêt page 6 pour bien déclarer ta css Smiley cligne

Sinon, graphiquement c'est un bon début, un peu sombre, mais joli Smiley cligne

Cdt,
Sylvain
Sujet clos
Aller à