Soucis width 100% avec chrome

bonjour à tous, mon site est en % et j'ai un soucis avec chrome. j'ai fais un bandeau constitué de plusieurs images placées cote à cote et dont la somme des width est de 100%, ce qui devrait donner un bandeau occupant toute la largeur de l'écran. est bien c'est le cas avec IE et mozilla, mais pas avec chrome, avec lequel le bandeau est légèrement inférieur à 100%
pourtant avec chrome si j'indique width 100% sur une seule image çà marche nickel, elle occupe bien toute la largeur de l'écran, mais pas avec plusieurs images cote à cote.
voici les codes:

<img src="accueilbb.jpg" id="accueilb"/>
	<img src="bandeaubb.jpg" id="boutiqueb"/>
	<img src="forumbbb.jpg" id="forumb"/>
	<img src="contactbbb.jpg" id="contactb"/>
	<img src="garantiebbb.jpg" id="garantieb"/>
	<img src="videobb.jpg" id="videob"/>
	

#accueilb{float:left;width:20%;height:5.4%;}
#boutiqueb{float:left;width:20%;height:5.4%;}
#forumb{float:left;width:20%;height:5.4%;}
#contactb{float:left;width:10%;height:5.4%;}
#garantieb{float:left;width:10%;height:5.4%;}
#videob{float:left;width:20%;height:5.4%;}

merci d'avance pour votre aide.
Modifié par alex84 (03 Jul 2012 - 21:01)

Hello,

Essaye de supprimer le whitespace en collant tes balises :

<img src="accueilbb.jpg" id="accueilb"/><img src="bandeaubb.jpg" id="boutiqueb"/><img src="forumbbb.jpg" id="forumb"/><img src="contactbbb.jpg" id="contactb"/><img src="garantiebbb.jpg" id="garantieb"/><img src="videobb.jpg" id="videob"/>

merci pour votre réponse.
je viens d'essayer mais çà n'a rien changé. pour mieux vous montrer le soucis j'ai fait une copie d'écran de la partie droite du bandeau, celle qui pose problème. avec mozilla et ie tout est ok :



voici maintenant avec chrome:



on voit bien que le bandeau s'arrête avant la fin de l'écran. on dirait que pour une image avec width 100% çà ne pose pas de soucis à chrome, mais que si c'est une somme de width donnant 100% pour lui çà ne fait pas 100% mais seulement 99.8%. car ce qui est marrant c'est que si à la dernière image je met width:20.2%, alors là çà devient ok pour chrome qui me fait bien un bandeau sur toute la largeur de l'écran, par contre forcément pour ie et mozilla c'est plus bon puisque pour eux la somme dépasse 100% ce qui provoque le "retour à la ligne" de la dernière image (vidéo).
y aurait-il moyen de faire une sorte de commentaire conditionnel pour chrome?
merci d'avance pour votre aide.
Modifié par alex84 (04 Jul 2012 - 07:46)

Au vu de l'exemple visuel, je me pose surtout 2 questions :
- pourquoi utiliser des images pour du contenu purement textuel ?
- pourquoi tu utilises des pourcentages ?

Si ton objectif est de faire du "responsive", il est bien entendu beaucoup plus logique, propre et simple d'utiliser du vrai texte, qui en plus ne se dégradera pas visuellement sur écrans rétinas.

Raphael a écrit :
Si ton objectif est de faire du "responsive", il est bien entendu beaucoup plus logique, propre et simple d'utiliser du vrai texte, qui en plus ne se dégradera pas visuellement sur écrans rétinas.

Et aussi un peu moins compliqué a modifier si un jour on veut le changer

Je pense que son choix s'est fait pour des questions de typo.

Perso, j'aurai fait comme ceci:

<ul>
  <li>Accueil</li>
  <li>Bt 1</li>
  <li>Bt 2</li>
</ul>

et ensuite, tu met tes li en ligne (inline-block?table-cell?), tu créé un motif de 1px de large pour ton fond gris, que tu met en background repeat-x sur le ul, et tu créé un autre motif de 1px de large qu tu met en repeat-x sur les li que tu veut avoir en violet.

désolé, pas le temps de te faire un exemple en CSS, mais Raphael t'expliquera ça mieu que moi
Modifié par JJK801 (04 Jul 2012 - 09:34)

merci pour votre réponse.
je dois préciser que mes connaissances sont encre très faibles et que j'y vais par tâtonnements et expérimentation.
oui j'ai choisis de faire mon site en % pour qu'il s'adapte aux écrans. au départ j'avais fais comme vous le dites justement des div avec une couleur de fond et un texte dedans. mon soucis c'était que comme le texte était en %, suivant le zoom çà devenait horrible.

là mon avantage avec les images c'est que çà ne bouge pas suivant le zoom. une fois que j'aurais bien étudié cette histoire de media quieries (je pense que c'est de çà que vous parlez) je compte tout refaire en px et là je n'aurais plus de soucis. mais là pour le moment je n'ai pas le temps de m'y mettre avant plusieurs mois donc pour le moment même si j'ai bien conscience que c'est pas le top ce que je fais je voudrais en attendant régler ce soucis avec chrome. j'ai oublié de préciser:
chaque image sera un lien image c'est pour celà que je ne fais pas une seule image mais plusieurs images cote à cote.
est-ce-que vous auriez une piste pour régler ce soucis de somme des width avec chrome?
Modifié par alex84 (04 Jul 2012 - 09:37)

alex84 a écrit :
chaque image sera un lien image c'est pour celà que je ne fais pas une seule image mais plusieurs images cote à cote.

Même si je trouve la méthode un peu archaïque, voila une astuce qui pourrai te convenir.

Mais je reste persuadé que c'est plus du bricolage qu'une solution...

Pour le problème, je pense qu'il s'agit tout simplement d'un problème d'arondi. Il n'y a donc rien à faire (si ce n'est prendre en comptes les conseil précédemment donnés et faire quelquechose de propre avec du vrai texte).

alex84 a écrit :

là mon avantage avec les images c'est que çà ne bouge pas suivant le zoom.

Ben disons que ta démarche est un peu contradictoire : tu choisis une philosophie fluide qui doit s'adapter au contexte et avec des unités fluides... mais tu ne veux pas que ça bouge