28172 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai un problème dans IE6. Les 2 derniers caractères du paragraphe se répète sur la ligne suivante.

Je n'en peux plus!!! Smiley biggol

Merci de votre aide Smiley smile

Voici l'adresse:
http://demo.suitevox.com/emballagesroda/forum/index.html

Mes fix sont dans le head de la page:

<!--[if IE 6]>
<style type="text/css">
.boxAccueil li.img02, .boxAccueil li p, .boxAccueil li.last p{display:inline;}
.boxAccueil li.img02{padding-left:15px;}
#btnsPlus li.Moins{padding-right:148px;}
.boxAccueil li.last{width:200px;padding-left:15px;}
</style>
<![endif]-->



#container1{width:970px; margin:0 auto; padding-bottom:15px; background:url(img/bgmain3.gif) repeat-y; height:100%; overflow:hidden;}
#container2Acc{float:left; width:970px;}
#flash{float:right; width:310px; height:224px; }
#container4{float:left; width:970px; background:url(img/bgmain2.gif) repeat-y;}
.boxAccueil{float:left; width:940px; margin:0; padding:0 0 0 30px; height:auto; overflow:hidden;}
.boxAccueil ul{margin:0;  padding:0 0 0 5px; list-style:none;}
.boxAccueil li{display:inline; float:left; width:205px; background-image:none; margin:0; padding:0 0 0 23px; min-height:118px; height:auto !important; height:118px;}
.boxAccueil li img{float:left; margin:0; padding:0 0 10px 0;}
.boxAccueil li h3{float:left; width:173px; clear:both; background: url(img/titrebg01.gif) 0 13px no-repeat; padding-left:20px; padding-right:0; min-height:30px; height:auto !important; height:30px;}
.boxAccueil li p{ float:left; width:200px; text-align:left; margin:10px 5px 5px 5px;}
.boxAccueil li.img01{float:left; width:205px; padding-left:13px; }
.boxAccueil li.last{float:left; width:225px; padding-right:0; }
.boxAccueil li.last img{padding-right:0; padding-left:0 }
#btnsPlus {float:left; width:950px; margin:0; padding:5px 0 0 16px; list-style:none;}
#btnsPlus ul{float:left;margin:0; padding:0; list-style:none; width:auto}
#btnsPlus li{ float:left; display:inline; background-image:none; padding-right:150px; margin-left:15px;width:auto}
#btnsPlus li.Moins{ float:left; display:inline; background-image:none; padding-right:148px; margin-left:12px;width:auto}

Modifié par webberte (01 Oct 2009 - 21:30)
Administrateur
Bonjour,

ah l'un de ces bons vieux bugs d'IE 6 Smiley mur

Commenter son code, c'est bien mais là c'est la cause de ton problème Smiley cligne (enfin c'est IE6 la vraie cause ...)
http://www.positioniseverything.net/explorer/dup-characters.html

EDIT: avant de supprimer tes commentaires, tu peux les déplacer dans l'élément (on va dire div pour faire simple) s'il était avant ou après ...
<!-- je fais bugger IE6-->
<div>
contenu
</div>

devient
<div>
<!-- résolu -->
contenu
</div>


PIE en a une bonne à laquelle j'avais jamais fait gaffe: mettre le commentaire dans un commentaire conditionnel ciblant les non-IE ... Smiley biggol
<!--[if !IE]>Put your commentary in here...<![endif]-->


Et bien entendu un commentaire PHP n'est pas vu par le navigateur ...
<?php /* commentaire PHP un peu lourd à taper quand même */ ?>

Modifié par Felipe (01 Oct 2009 - 19:50)
Felipe, j'ai enlevé tous les commentaires de ma page, j'ai mis les fix dans un css à part et j'ai toujours le même problème.


*html .boxAccueil li.*html img02,*html .boxAccueil li p,*html .boxAccueil li.last p{display:inline;}
*html .boxAccueil li.img02{padding-left:15px;}
*html #btnsPlus li.Moins{padding-right:148px;}
*html .boxAccueil li.last{width:200px;padding-left:15px;}
J'ai trouvé ce fix qui fonctionne malgré que ça ajoute un commentaire!!!!! Smiley biggol
Il faut l'ajouter dans un div vide à la fin de la phrase où s'affiche l'erreur, dans ce cas-ci dans la balise p.

CODE HTML:

<p>Bouteilles, pots et jarres en plastique de formats variés.<!--<div class="dupfix"></div>--></p>


CSS
.dupfix {
float: left;
width: 1px;
height: 0px;
line-height: 0px;
visibility: hidden;}


Touvé sur ce site:
http://www.quirksmode.org/bugreports/archives/2004/12/IE6_Row_of_Floats_Another_duplicate_characters_bug.html
Modifié par webberte (01 Oct 2009 - 23:44)