28172 sujets

CSS et mise en forme, CSS3

Background-image et background-repeat : OK dans HTML mais pas dans CSS

Bonjour,

Je me heurte à un mystère :

Je veux répéter un arrière plan dans une <div>.
Quand j'utilise les propriétés CSS adéquates dans la CSS rien ne se passe, quand j'utilise la propriété style de la balise <div>, ça marche.

Pour tester j'ai mis 2 <div> identiques dans mon code HTML.


<div class="ongletTitre1">Forfaits</div>
<div class="ongletTitre1" style="background-image : url('img/onglet1.gif'); background-repeat : repeat-x;">Forfaits</div>


J'ai dans ma CSS :

.ongletTitre1
{
	background-image : url('img/onglet1.gif');
	background-repeat : repeat-x;
}


Le fond se répète bien dans la deuxième <div> mais pas dans la première.
Pourtant le contenu du "style" est un copier/coller de la CSS.

Je n'ai bien qu'un .ongletTitre1 dans ma CSS.

Une idée du pourquoi ?

Merci
Modifié par Zendik (29 Apr 2008 - 16:36)
Hello Smiley smile ,

Il peut y avoir plusieurs raisons (problème d'héritage / des sélecteurs, chemin vers feuille de style erroné, etc.).

As-tu une page en ligne ? Smiley cligne
Bonjour,

Suspect numéro: les chemins de fichier.
Si ta feuille de styles n'est pas dans le même répertoire que la page HTML, tu ne peux pas utiliser le même chemin car en passant par style le chemin part de la page HTML, et en passant par la feuille de styles le chemin part de la feuille de styles.

Cela peut éventuellement être un problème de priorité des sélecteurs comme le suggère aussi BeliG, mais ce cas est un peu plus rare.
Merci pour vos réponses.

Non, désolé mais je n'ai pas de page en ligne.

La feuille de style fonctionne parfaitement pour le reste... donc ça ne vient pas du chemin.

Ensuite, concernant l'héritage, que je ne maitrise pas, je suppose que pour spécifier un héritage il faut utiliser une syntaxe bien précise dans la CSS, hors je n'utilise que des "trucs" qui commencent par un '.' (comme '.ongletTitre1') pour l'utiliser avec class="XXX" dans le code HTML.
Donc je ne pense pas que ça hérite de quoi que ce soit.

Et mes 2 balises <div> ne se trouvent dans aucune autre sinon <HTML> et <BODY> avec dans la CSS :

html,body{
	margin : 0;
	padding : 0;
	border : 0;
}


De plus si je supprime tout de ma CSS sauf le bloc correspondant à .ongletTitre1, ça fait pareil...

Si quelqu'un a une autre idée...
Modifié par Zendik (29 Apr 2008 - 18:41)
Salut,

Surement un problème d'héritage (quoique sans page en ligne Smiley biggol )
Sinon, une fois ta feuille dépouillée... tente quand même un Ctr+F5 pour vider ton cache avant de tester.
Bonjour,

J'ai identifié l'origine de mon problème. Comme souvent c'était tout bête... et j'ai honte...

Ma CSS "ai.css" se trouve dans un dossier CSS et mes images dans un autre dossier "img".
Dans ma CSS et dans les balises "style" de mon fichier HTML, pour spécifier le chemin de l'image je mettais "img/toto.gif".
Or, par rapport au fichier HTML, c'est bien le bon chemin. Mais pas par rapport à la CSS, dans laquelle il fallait mettre "../img/toto.gif".

Voilà pourquoi ça marchait avec l'attribut "balise" mais pas dans la CSS...

Voilà.... En espérant que ça aidera quelqu'un un jour...
Sujet clos
Aller à