[RESOLU]Problème de positionnement (3 images dans une bannière)

Salut,

Le problème a déjà du être soumis mais je n'arrive pas à trouver de réponse claire à ma question.
En fait j'ai une bannière avec une image de fond sur laquelle je souhaiterais positionner 3 images (logo a gauche, espace pub au milieu, et slogan a droite) malheureusement, newbie comme je suis toutes mes tentatives s'avèrent mauvaises). Je souhaiterais bien sur que la bannière soit adaptable pour le maximum de résolution (1024*768 minimum). Voici ce qui me semble le plus cohérent :

HTML

<div id="header">
	<img class="logo" src="img/logoHW-trans.png" alt="Horsewood, Pasionn&eacute;ment Cheval" />
	<img class="pub" src="img/pub.gif" alt="Pub"/>
	<img class="slogan" src="img/8000REF-trans.png" alt="Plus de 8000 r&eacute;f&eacute;rences !"  />	
</div>

CSS

/* ---- Bannière */
#header
{
background: url(../img/fond.png) top repeat-x;
height:86px;
}


	/* ---- Logo Pub Slogan  dans la bannière ----- */
	#header .logo
	{
	float:left;
	}
				
	#header .slogan
	{
	float:right;
	}
			
	#header .pub
	{
	text-align:center;
	}

				
	
/* ---------------------------------*/

Le résultat donne un truc tout moche ou seul mon logo a gauche est bien placé. La bannière de pub suit le logo et enfin le slogan sort à moitié du div .
Merci de votre aide (et désolé si ce post est redondant).
Modifié par EggY (24 May 2006 - 13:49)

Salut

Essais de mettre "Float : left;" a tous tes styles.

Et si possible, un lien pour qu'on puisse voir ce que ca donne, parce que t'as description du resultat est un peu sobre

voilà ce que ca me donne

Pas tip top hein

Edit : Si je met tout à left toutes les éléments en ligne (mes images) se suivent de la même manière que si je ne spécifiais pas de float.
Modifié par EggY (24 May 2006 - 11:57)

J'ai un peu avancé sur mon shmilblik mais mon gros soucis reste de centrer ma bannière de pub. Je peux bien sur spécifier un margin-left en pixel ou en % mais si je change de résolution ma pub n'est plus centrée.
Modifié par EggY (24 May 2006 - 12:42)

Ayé à force d'acharnement et grâce au super livre de Raphaël que j'ai acheté récemment j'ai pu trouve mon ptit problème (javais mal lu au départ). Je met mon code ici ca servira peut etre à quelqu'un :

HTML

	<div id="header">
		<img class="logo" src="img/logoHW-trans.png" alt="..." />
		<img class="slogan" src="img/8000REF-trans.png" alt="..."  />	
		<img class="pub" src="img/pub.gif" alt="..."  />	
	</div>

Attention mettre les images dans un certaine ordre (a priori les float d'abord puis la pub)

css

#header
{
background: url(../img/fond.png) top repeat-x;
height:86px;
text-align:center;
padding-left:15px;
padding-right:15px;
}


	#header .logo
	{
	float:left;		
	}
				
	#header .slogan
	{
	float: right;
	margin-top:15px;
	}
			
	#header .pub
	{
	margin-top:10px;
	}