28220 sujets

CSS et mise en forme, CSS3

Bienvenue dans cet épisode de mes aventures dans le monde d'internet explorer. Au menu du jour, un problème de répétition d'image (vui... ca donne pas faim).

Mais regardez vous-meme (avec IE et un autre navigateur pour voir la différence) :

http://karyboo.free.fr/karyweb

L'ombre (celle des barres haute et basse sur la page) se répète dans IE... wtf ???

Pourtant mon code me parait bon, voyez donc :

html...

<div id="ombre">
</div>


css...

#ombre
	{
	position: relative;
	width: 100%;
	height: 8px;
	background-image: url(ombre.gif);
	}


(l'image "ombre" est une image de 1*8 px qui se répète tout le long de la page).

Qu'en pensez vous ?
Smiley ohwell
Modifié par karyboo (20 Jul 2005 - 15:21)
ça se voit très peu si c'est ce que j'ai vu!
Mais si tu as le soucis du détail, essaie ça:

 background-image: url(ombre.gif) no-repeat;
Oui j'ai déjà vu ce topic, je pense pas que ce soit exactement le meme problème... et puis je comprend pas trop ton code Smiley langue . Ce serait peut-etre un moyen de contourner mon problème, mais pas de le régler. Sinon j'ai la possibilité d'augmenter la hauteur de l'image pour éviter la répétition... mais ce serait mieux de trouver l'origine du problème Smiley cligne ... en fait j'ai l'impression que dès que je met une image en background dans un <div> de moins d'un dizaine de pixels de hauteur, la hauteur que j'indique en css n'est pas prise en compte par IE qui la règle automatiquement à 20px...

pops83 --> si je met ca m'enlève mon effet, le but c'est d'avoir une image hyper-légère (a 1*8px tinquiette qu'elle l'est) qui se répètent sur toute la largeur.
Modifié par karyboo (20 Jul 2005 - 15:10)
c'est effectivement un moyen de contourner un bug ie.

dans un div vide, ie "ajoute" un contenu dont le hauteur est égale à la hauteur de ta font.

si ton image de fond est plus grande, pas de problèmes. sinon, décalage.

pour la répétition sur la largeur, il faut mettre
 background-image: url(ombre.gif) repeat-x;
Merci pour ces explications, ca marche nickel avec ce code :

#ombre
	{
	position: relative;
	width: 100%;
	height: 8px;
	background-image: url(ombre.jpg);
	background-repeat: repeat-x;
	}

Quel crasheur ce IE !

[résolu] !

Smiley biggrin
Modifié par karyboo (20 Jul 2005 - 15:21)