Personnliser chaque bloc

Bonjour à tous ,

Voila j'ai presque fini de structurer ma page tuteur, mais la j'avoue ne pas savoir comment mi prendre donc je viens à vous pour plus de conseils.
J'aimerais placer en entête et un pied pour chacun de mes blocs construit (ex bloc menu, bloc contenu ,...)

HTML:

<div class="block">ACCUEIL</div>
<div id="contenu"><!-- Ceci est mon contenue principal -->
	    <H1>Titre de l'article</H1>
<h2>Sous titre</h2>

<P align="justify">Mon texte</P>
	  </div>

CSS

.block {
	background-image:url(../images/center.png);
	background-repeat:repeat-x;
	background-color:#FFFFFF;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	font-size: 16px;
	color: #FFFFFF;
	text-align:center;

#contenu {
	margin-left:202px;
	margin-right: 0%;
	margin-top:5px;
	height:Auto;
	background-color:#E6F1F7;
	font-size: 16px;
	font-weight: bold;
	font-style: normal;
	border: thin outset #FF6600;
}

par ailleurs je ne sais pas ou placer un second backgroune-image représentant chacun des blocs (ex bloc accueil = une simple maison, bloc custom = un pot de peinture,... . Quelqu'un serait il ou et comment faire cela ?

Mille fois merci à tous
Modifié par worms30 (23 Apr 2008 - 19:10)

J'ai trouvé quelques chose de pas trop mal mais qui posera des problème selon la résolution de chacun.

Voici se j'ai trouvé pour réussir à placer mes deux image sur une même ligne . pour faire cela je n'ai pas trouvé une réponse pour placer mes 2 images sur ma ligne depuis le css, en revanche c'est possible en utilisant ma page html :
voici le balisage:

image 1 = <img src="images/Center.png" width="269" height="22" border="0" style="float:left" />
image 2 = <img src="images/right.png" height="22" style="float:right"/>
PS: l'image 1 (center) s'applique sur tout le long de la ligne de façon répété!!!

le problème qu'il se pose c'est qu'une fois ces deux images collé sur ma page cella va varier selon la résolution des internautes, par concequant les image vont se chevauché se qui n'est pas tres jolie.

Donc il y aurait il un moyen pour joindre ces deux image sans passé par la fonction "px" en sachant que la valeur % n'est pas prise en compte comme ceci "width="100%"" et ne sais pas comment inclure dans mon balisage la fonction repeat-x qui me semble serrait la plus approprié.:D

Merci a tous

Bonjour,

J'avoue trouver tes explications un peu compliquées et... je ne comprends pas des masses à quoi tu veux arriver.
Ne serait-il pas possible d'avoir une prévisualisation du résultat escompté ?

Ca nous permettrait de voir si la méthode utilisée est bien la bonne...