[RESOLU]Espace entre deux div

Bonjour

Je n'arrive pas à faire coller le bloc "main" à l'image, malgré des padding et des margin à 0. J'ai le config.php suivant:

<div align="center">
  <img id="img_entete" SRC="templates/GestInfo_general/images/enseigne.png">
<div id="main">
  <div id="header-top-outer">	
    <!--<div id="topmenu">	
    <?php if (mosCountModules( "user3" )) { ?><?php mosLoadModules ( 'user3',-1); ?><?php } ?>
  </div>
  <div id="suche">	
    <?php mosLoadModules ( 'user4',-1); ?>
    </div>-->
  </div>
</div>

J'ai mis le code php en commentaire afin d'^tre sûr qu'il n'est pâs en cause.

Pour la css, j'ai:

#img_entete {
	/* style des images en tête de page */
	padding: 0px;
	margin: 0px;
	top: 0 px;
	/*width: 1280 px;
	height: 176 px;*/
	width: 800 px;
	height: 140 px;
}

#main {
	width: 800px;
	padding: 0;
	margin: 0;
}

#header-top-outer {
	padding:0;
	margin:0;
	top:0;
	width:800px;
	height:24px;
	background-image:url(../images/barremenu_1.png);
	background-repeat:repeat-x;
	/*border: 1px solid #ffffff;*/
	color:#333333;
	text-align:left;
}

Le résultat obtenu est

Merci de me mettre sur la voie.
Modifié par jacma (25 Jan 2008 - 12:02)

Bonjour,

L'élément img étant un élément inline au même (presque) titre qu'une lettre de l'alphabet dans un paragraphe, essaye de donner un display:block puisque tu as déjà donné une largeur et une hauteur (à #img_entete).

Bonjour

C'est celà . J'ai ajouté display dans le style #img_entete. J'avais tout d'abord essayé dans le style #header-top-outer sans résultat.

Peux tu expliquer le principe de display-block. Je ne comprends pas vraiment ce que vient faire l'affichage en liste. J'ai lu pour display-block: spécifie un bloc- list-item le bloc sera affiché sous forme de liste. Enfin, le proncipal est que cela fonctionne.

Merci.
Modifié par jacma (25 Jan 2008 - 11:30)

C'est très simple, les balises html, se rangent dans 2 catégories principales, les élément de type bloc et les les éléments de type en-ligne. Dans les blocs, nous avons des balises genre h1, h2, h... p et div, qui est une balise bloc générique. Dans les inline nous avons les strong, em, sup, span etc (équivalent de div, mais pour inline) ainsi que img, qui est un petit cas à part mais qui se comporte comme un élément en ligne, c'est à dire qu'il est dépendant de son environnement, par exemple son espace line-height, d'où sans doute l'espace en bas de ton image.
Par contre 2 éléments blocs (avec un margin à 0) l'un sous l'autre se collent parfaitement.
Bon c'est un peu mal expliqué mais en gros c'est ça
Pour en savoir plus sur les inline et block

PS: Il faut ajouter RESOLU à son topic
Modifié par zzzazzz (25 Jan 2008 - 11:50)

Merci. J'y vois un peu plus clair. Et je n'avais pas mis RESOLU car l'addentum à ma question ne l'était pas .

Merci de ton aide.