28221 sujets

CSS et mise en forme, CSS3

Problème background

Hello tout le monde,

Alors j'ai fait ma mise en page et j'ai mis un fond sur mon menu de gauche et de droite, mais le problème est qu'il s'affiche en haut seulement du menu et non pas de bas en haut... ce qui est fort ennuyeu... Quelqu'un pourrait m'eclaircir... ?

#gauche {
	position: absolute;
	left:0;
	width: 110px;
	background-image:url(gauche.png);
}


Merci d'avance. Smiley biggrin
Bienvenue !

Euh j'ai rien compris...
Tu veux quel résultat (image aligné en haut, répétée verticalement...) ?
Modifié le 10 Jan 2005 - 11:56
Essaie ça :

#gauche {
 background: url(gauche.png);
 background-position: left;
 background-repeat: repeat-y;
}

Si j'ai bien compris ça devrait faire ce que tu veux.
littlesam a écrit :
Essaie ça :

#gauche {
 background: url(gauche.png);
 background-position: left;
 background-repeat: repeat-y;
}

Si j'ai bien compris ça devrait faire ce que tu veux.


J'ai un vieux doute au niveau du background-position, je crois qu'il faut spécifier 2 valeurs (horizontale et verticale), il n'est en fait pas utile à priori, de même le mélange de propriété raccourci (background) et de propriété précise (-position, -repeat) n'est sûrement pas des plus génial.

#gauche
{
  background: url(gauche.png) repeat-y ;
}
Arf... bah c'est normal, c'est un élément vide. Il n'a aucun contenu et tu ne lui donne pas de hauteur :s, comment veux tu qu'il étende le background Smiley cligne

D'ailleurs ton code HTML n'est pas des plus adapté, pourquoi utiliser des divs vide ???
Quel est le but final, as tu un screenshot de ce que tu veux obtenir ?
non je ne veux rien mettre dedans, c'est juste pour fantaisie...

Si ce n'est pas adapté, c'est parceque je debute... et que j'aprend petit a petit.

qu'est ce qui serait le plus adapté alors ?

merci d'avance... Smiley smile
d_shark a écrit :

qu'est ce qui serait le plus adapté alors ?

Faudrait voir le contexte.

Grosso merdo, tu devrais pouvoir placer ton backround en bas de l'élément précédent avec un padding-bottom égale à la hauteur de ton image, ou placer le background en haute de l'élément suivant avec un padding-top toujours égale à la hauteur de l'image.

Mais ton code HTML ou un lien vers ta page serait d'un grand secours...

<edit>
Oups, je viens de voir le lien... Smiley confused
</edit>
Modifié le 10 Jan 2005 - 13:37
Attention, la syntaxe avec les guillemets simples peut être problématique :

background-image:url('fond.gif');

Mieux vaut utiliser les guillemets doubles ou aucun guillemet :

background-image:url("fond.gif");

ou

background-image:url(fond.gif);

LA CHATTE NOIRE a écrit :

Problems with background images

1. IE Mac cannot see background images that are linked to a stylesheet using the following code: selector {background: #ccc url('myimage.gif')}. Note the single quotemark in the url.

Source : LA CHATTE NOIRE : IE 5 Mac: miscellaneous bugs
Modifié le 10 Jan 2005 - 13:57
Tu pourrais mettre le background directement dans le conteneur je pense.

http://www.elmoustikoblog.net/tutoriels/css/mise_page/
Dans ce tutoriel tu as un exemple d'ajout d'image décorative dans le contenu de la page sans ajout de code supplémentaire, tu peux y jeter un oeil pour voir l'astuce Smiley cligne


-edit- @Stephan, les guillemets doubles aussi posent problèmes dans certains navigateurs, pas du tout de guillemets c'est la solution d'une part ils ne servent à rien, d'autre part ils sont soucis d'incompatibilité dans certains navigateurs.
Modifié le 10 Jan 2005 - 13:48
Olivier a écrit :

-edit- @Stephan, les guillemets doubles aussi posent problèmes dans certains navigateurs...

Dans quel contexte ? @import ?
Parce que j'utilise les guillemets doubles dans ce contexte-ci et je n'ai noté aucun problème sur les navigateurs et plates-formes que j'ai testés. Smiley confus
Il me semble que pour le background aussi ça pose problème, au moins sur un navigateur, dans le genre IE5 Mac peut être. Ou Safari eventuellement ou konqueror... enfin j'en suis pratiquement sûr mais je peux me planter. Mais de toute façon, vu que les "" ne servent à rien, autant ne pas les mettres, on est sûr de pas avoir de problème Smiley lol
Je ne suis pas certain mais il me semble que les guillemets soient obligatoires dans le cas de noms espacés. Bien sûr, pour des noms d'images, ca n'arrivera pratiquement jamais; mais je pense qu'il faut écrire par exemple "Times New Roman".

Smiley jap
Pour les noms de polices, oui en effet, mais pour un background, le nom est compris entre 2 parenthèse (ouvrante/fermante), donc les parenthèses jouent en quelque sorte le rôle des guillemets pour les font-family
Oui j'avais lu ça quelquepart. Etait-ce un conseil ou une obligation ça je ne me souviens plus par contre Smiley confused (je sais ça n'aide pas beaucoup une réponse pareille).
Sujet clos
Aller à