28173 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai un petit souci d'alignement avec l'image de stats xiti sur mon site.
Je suis effectivement en train de tout retravailler et je ne parviens pas à faire ce que je veux Smiley sweatdrop
Je suis novice en css ...

En pas de page j'ai mon footer :

p#footer
		{
			margin: 0 ;
			height: 178px ;
			padding-right: 10px ;
			text-align: right ;
                        vertical-align: bottom;
			color: #8a0 ;
			background: url(../img/footer_zozo.jpg) no-repeat center bottom ;
			
		}


Le bas de ma page html se termine donc par

<p id="footer"></p>

Je ne sais pas où placer ce fameux logo xiti pour qu'il s'aligne
Actuellement mon code xiti a été placé juste au dessus du footer.
Quand j'insère le code xiti à l'intérieur du <p id="footer">code xiti</p> ça me le mets en dessous de l'image de fond.

Un exemple en images:

Mon footer actuel :
http://pomelo.free.Fr/images/footer1.jpg

Et je voudrait que ça donne :
http://pomelo.free.Fr/images/footer2.jpg

Voilà, je ne sais pas trop comment faire pour que ça s'affiche au bon endroit.

Merci par avance à celles et ceux qui pourront m'éclairer Smiley smile

Bonne journée
Modifié par Pomelo (19 Nov 2007 - 13:41)
tu as essayer padding-top 100px; par exemple ? je dis peut être une bêtise sa risque de déplacer le tous.

ta essayer de faire un position: absolute; pour placé c'est le mieux je trouve.
tu peut le placé au pixel près donc plus de problèmes:

/////////////////////////////
css:
#footer {
position: relative;
padding-right: 10px ;
height: 178px ;
margin: 0;
color: #8a0 ;
background: url(../img/footer_zozo.jpg) no-repeat center bottom ;
}
#footer h1#xiti {
position: absolute;
margin: 0; padding: 0;
top: 50px; left:160px; /* ici tu place ou tu le veut tu peut remplacer left par rigth */
width: 20px; height:20px; /* tu replace par la taille du h1 */
}

////////////////////////////////////
xhtml / html:
<div id="footer">
<h1 id="xiti"><!-- ton script xiti --></h1>
</div>

je suis pas un pro en css ni xhtml mais normalement sa marche. tu peut utilisé d'autre méthodes mais celle si et valide w3c