Problème sous firefox et IE8 pour répéter une image [résolu] - HTML/CSS - Programmation
Marsh Posté le 14-05-2010 à 10:44:46
Est-ce que la longueur permet une répetition ?
Pour le savoir, vous pourriez ajouter au style de barreJauge :
border:1px solid black; |
Edit : Dans mes exemples, je vois toujours le nom d'une couleur ou le mot transparent avant url() Peut-être que cette absence de propriété de couleur perturberait les navigateurs.
Exemple : background:#f0eee0 url(/img/bg1.png) repeat-x top right;
Voir doc officiel à http://www.w3.org/TR/CSS2/colors.html#background
Marsh Posté le 17-05-2010 à 16:57:37
Dans le style barreJauge, j'ai rajouté "display: inline-block;" et ça fonctionne ! A priori, span ne tient pas compte de width sans cela (sous FF et IE8).
Marsh Posté le 12-05-2010 à 18:00:30
Bonjour,
j'ai un problème d'affichage sous IE8 et firefox (sous IE6 pas de souci) : j'essaye d'afficher une barre (découpée en 3 morceaux) sur la largeur de la page. Or l'image ne s'affiche ne se répète qu'une seule fois alors que l'on a bien la propriété repeat-x . Quelqu'un verrait-il où est le souci avec IE8 et FF ?
Contenu jsp :
[...]
<div class="row left colonne100">
<span class="colonne10 barreJauge">
</span>
<span id="jauge_plein_synthese" onclick="javascript:changerEtatOnglet('perspectives', 'synthese');" style="cursor:pointer;">
<html:img styleClass="collapse1" srcKey="icone.jauge_plein" styleId="jauge_plein" alt="" />
</span>
<span id="jauge_vide_synthese" onclick="javascript:changerEtatOnglet('perspectives', 'synthese');" style="cursor:pointer;display:none;">
<html:img styleClass="collapse2" srcKey="icone.jauge_vide" styleId="jauge_plein" alt="" />
</span>
<span class="colonne25 barreJauge">
</span>
<span id="jauge_vide_perspectives" >
<html:img styleClass="collapse3" srcKey="icone.jauge_vide" onclick="clicPerspective()" styleId="jauge_vide" alt="" />
</span>
<span id="jauge_plein_perspectives" style="display:none;">
<html:img styleClass="collapse4" srcKey="icone.jauge_plein" styleId="jauge_vide" alt="" />
</span>
<span class="colonne55 barreJauge" >
</span>
</div>
[...]
Contenu css :
[...]
.row {
clear: both;
}
.left {
float: left;
}
.colonne100 {
width: 100%;
}
.colonne55 {
width: 55%;
}
.colonne25 {
width: 25%;
}
.colonne10 {
width: 10%;
}
.barreJauge{
background: url(../images/barre_bleu.gif) repeat-x 0px 0px;
margin-bottom: 10px;
margin-left: -3px;
}
[...]
Message édité par ib@w le 17-05-2010 à 16:57:57