Problème de placement d'image de fond

Question

Bonsoir à tous,
je dois réaliser un site pour mon stage et je galère sur la partie CSS du site (c'est pas trop mon truc   )

Le site est composé du header (largeur 1024), du menu (1024) ensuite j'ai mis une image en float left et le contenu doit s'afficher a droite avec une marge de 280px.
Enfin en bas le pied de page avec une image en fond.

Voici des images pour comprendre.
Lorsque le contenu est court pas de soucis :

http://img269.imageshack.us/img269/3585/75504412.jpg

Lorsque le contenue est long ... :

http://img710.imageshack.us/img710/7365/41937468.jpg

Quelqu'un aurait une idée pour que l'image utilisé en fond dans le div que j'ai mis en "float: left" colle le div "pied de page"?

Merci d'avance

Wart!n · Answer

Tu voudrais que l'image ne se répète pas, c'est ça ?

bebe28 · Answer

L'idéal ne serait-il pas de mettre ton image en fond de ta page sans avoir à la couper en 2 (menu et pied de page)?

A ce moment là, l'image serait calée comme suit dans ta page:

<body style="background-attachment:fixed;">

clader · Answer

Merci pour vos réponse. 
Oui il faudrait que l'image ne se répete pas mais surtout qu'elle "colle" à l'image en pied de page afin de donner l'impression d'avoir un seul et même arbre.

Pour bebe28, le soucis avec ta technique c'est que j'ai peur que si le contenu augmente l'image ne suive pas vers le bas mais se répete (ou ne se répete pas mais reste planté au milieu). Et puis j'aime bien avoir un "vrai" pied de page que je peux inclure sur chaque page.
mais je vais quand même tenté ;-).

Merci ++

Wart!n · Answer

Je proposerais ce script :
<body style="background: black url(./images/fond.png) no-repeat top left;">

bebe28 · Answer

Wart!n, il ne serait pas mieux de l'aligner avec le pied de la page:

<body style="background: black url(./images/fond.png) no-repeat bottom left;">

Wart!n · Answer

Si c'est ce qui est cherché, oui. Merci bebe28.

clader · Answer

Enfaite j'ai déja ca dans mon CSS :

body    
{
	background:url(img/fond.jpg);
	margin:0;
	padding:0;
	background-attachment: fixed;
	text-align:center;
}	

Et l'image de fond utilisé c'est ce que vous pouvez voir sur les images que j'ai envoyé (les bandes a droite et a gauche noir grise).

Le contenu global que j'ai appelé "conteneur" est le premier div appelé (dedans il y a le div du header, le div du menu, etc...)

#conteneur  
{
	margin:0 auto 0 auto;
	position:relative;
	width:1024px;
	background:white;
} 

Donc est ce que c'est dans ça que je devrais tenter de mettre la déclaration de mon fond?

Merci d'avance

bebe28 · Answer

Tu dois déclarer ton fond dans "body".

Wart!n · Answer

Rajoute ça (https://forums.commentcamarche.net/forum/affich-15809253-probleme-de-placement-d-image-de-fond#5) à ton script pour voir, ça changera surement ta page.

clader · Answer

Merci c'est déja mieux^^.
http://img710.imageshack.us/img710/6282/11855809.jpg

Par contre comment virer la bande noire? Tout le reste marche si j'augmente la longueur du contenue ca descend bien mais la bande noire augmente.

Wart!n · Answer

Tu change la couleur du Background

Wart!n · Answer

<body style="background: #FFFFFF url(./images/fond.png) no-repeat bottom left;">
Tu remplasse "black" par "#FFFFFF" (qui correspond à la couleur blanche).

Bien cordialement

clader · Answer

Merci beaucoup! Ca marche ^^.

Merci pour les conseils rapides,++

Wart!n · Answer

N'oublie pas de mettre ton sujet comme résolu ;-)
Bonnes fêtes de fin d'année !

Problème de placement d'image de fond

14 réponses

Votre réponse

Discussions similaires

Newsletters