28173 sujets

CSS et mise en forme, CSS3

Hi all,

J'essai de placé une banniere en haut de mon site, cette banniere est une image en 480*60 avec une une balise <p></p>

le code html :
<div id="header">
<p>Le bonheur va vers ceux qui savent rire</p>
</div>


le code css:

#header{
	height: 100px;
	background: #000000 url('image/banniere.jpg') top left no-repeat;
}
#header p{
	margin: 0 0 0 300px;
	font-weight: bold;
	color: white;
}


la banniere se place bien en haut a gauche tt le long de la fenêtre mais l'image ne s'affiche pas, seul le background noir et la phrase s'affiche.

Pourquoi ça ne s'affiche pas ?!!

Merci pour vos réponses.
Salut,

essayes :

#header{
height: 100px;
background: #000000 url(./image/banniere.jpg) top left no-repeat;
}


si ta css est à la racine et ton dossier image aussi.

Ensuite si elle s'affiche toujours pas, des fois il m'arrive que ffox veuille pas trop de parametres autour du chemin de l'image alors tu les extraits, un par un :


#header{
height: 100px;
background:  url(./image/banniere.jpg) ;
background-repeat: no-repeat;
background-color: #000000;
background-cposition: top left;
}

Modifié par Hum (10 Oct 2006 - 22:45)
Oui je l'ai vu juste après le post lol, merci pour la réponse !!

G un autre problème Smiley sweatdrop

l'image ne prend pas la totalié du background, la position es bonne mais la taille de l'image est trop petite, elle ne prend qu'une partie de la banniere Smiley confus

Comment pour que l'image prenne la taille voulu ?
J'ai lu ce matin un truc sur "background-size", mais c'est du CSS3 et je n'ai pas réussi a le faire fonctionner. Essaie la peut etre que ca fonctionnera pour toi.
Bonjour,

Et pourquoi pas simplement :

#header{
        width: 480px
	height: 60px;

	background: #000000 url('image/banniere.jpg') top left no-repeat;

}

??
Bonjour,

Aucune raison pour que ça ne fonctionne pas !!

donnes nous un exemple en ligne et quel est le résultat que tu veux obtenir, ça sera plus clair ...
Je voudrais que l'image prenne toute la fenêtre et non que sa taille.

Je vous joins un screen pour que vous voyez ce qu'il y a comme problème.
upload/5108-screenban.JPG

comme vous pouvez le voir la banniere est petite et le reste est le background du header, je voudrais que l'image prenne tout le header. L'image est le background du header dans mon code CSS.
Bonjour,

Il y a un truc que je ne comprends pas, ton image de fond fait : 480*60 px comment veux tu qu'elle s'agrandisse ?

Si tu veux vraiment qu'elle suive la résolution d'écran, il faut la placer dans le html avec un width : 100% mais bon, avec ta taille actuelle ça risque de pixeliser grave.