Sujets similaires

Sujet: Probleme affichage P.A pour Internet Explorer Mar 04 Sep 2012, 10:15

Bonjour a vous.... Je vais essayé d 'expliquer au mieux mon soucis...

Actuellement sur notre forum : http://cinemaniac.lebonforum.com/

Nous disposons d'une Page d’accueil, nous nous sommes rendus compte qu'avec Mozilla et Chrome elle s'affichait sans soucis (formes etc...) Mais avec Internet Explorer c'est comment dire: "Carré"

==>

Spoiler:

Nous voulions savoir si il était possible de faire qu'il soit visible sur Explorer comme sur les autres navigateurs car nous l'aimons beaucoup tel quelle ("regard" coulissant, arrondis...)

Merci de votre aide...En esperant avoir une réponse...

Voila le code collé dans page d’accueil :

[ hide]

Code:: <div style="width:800px;background-image:url('http://lecoindefranie.l.e.pic.centerblog.net/mpenu0un.jpg'); text-align: center; border-bottom: 10px #000000 solid; border-top: 10px #000000 solid;"><br><table><tbody><tr><td><span style="margin-left:70px;text-align:center;white-space: nowrap;font-size:50px;color:white;font-family: georgia;">Bienvenue sur CinéManiac</span><br><div style="text-align: center;"><span style="font-size:40px;color:white;font-family: georgia;">{USERNAME}</span><br></div><br>
</td></tr></tbody></table><center><table><tbody><tr><td><div class="boutons" style="padding-top:3px;"><a href="http://cinemaniac.lebonforum.com/t538-reglement-du-forum">Réglement</a></div></td><td><div class="boutons" style="padding-top:3px;"><a href="http://cinemaniac.lebonforum.com/f2-presentation-des-membres">Présentation</a></div></td><td><div class="boutons" style="padding-top:3px;"><a href="http://cinemaniac.lebonforum.com/f36-centre-de-recrutement-on">Recrutement [ON]</a></div></td><td><div class="boutons" style="padding-top:3px;"><a href="http://cinemaniac.lebonforum.com/f59-tutoriaux">Tutoriaux</a></div></td><td><div class="boutons" style="padding-top:3px;"><a href="http://cinemaniac.lebonforum.com/f122-le-forum">Le Forum</a></div></td><td><div class="boutons" style="padding-top:3px;"><a href="http://cinemaniac.lebonforum.com/f25-nous-lier">Nous Lier</a></div></td></tr></tbody></table></center>
<table><tbody><tr><td><blockquote style="margin-left:10px;width:315px;height:300px;background-color:#FFFFFF;border: 3px solid lightgrey;border-radius: 15px 0px 15px 0px;"><span style="text-align:center;white-space: nowrap;font-size:25px;color:lightgrey;font-family: georgia;letter-spacing:5px;"><br>STAFF</span><br>
<center><table><tbody><tr><td><div class="slidez"><p></p><div style="margin:auto;text-align:center;width:100%"><strong>TonY</strong></div><table><tbody><tr><td><a href="http://cinemaniac.lebonforum.com/u1">Profil</a> ♦ <a href="http://cinemaniac.lebonforum.com/privmsg?mode=post&u=1">MP</a></td><td><font color="lightgrey">________</font>«<span style="font-size: 10px; line-height: normal"><i>Admin.</i></span>»</td></tr></tbody></table><p></p><img src="http://img839.imageshack.us/img839/3913/copie2debanniere1pa.png"></div></td></tr><tr><td><div class="slidez"><p></p><div style="margin:auto;text-align:center;width:100%"><strong>rosedesvents</strong></div><table><tbody><tr><td><a href="http://cinemaniac.lebonforum.com/u2">Profil</a> ♦ <a href="http://cinemaniac.lebonforum.com/privmsg?mode=post&u=2">MP</a></td><td><font color="lightgrey">________</font>«<span style="font-size: 10px; line-height: normal"><i>Admin.</i></span>»</td></tr></tbody></table><p></p><img src="http://img51.imageshack.us/img51/8210/banniere1pa.png"></div></td></tr><tr><td><div class="slidez"><p></p><div style="margin:auto;text-align:center;width:100%"><strong>LonelyClarrise</strong></div><table><tbody><tr><td><a href="http://cinemaniac.lebonforum.com/u8">Profil</a> ♦ <a href="http://cinemaniac.lebonforum.com/privmsg?mode=post&u=8">MP</a></td><td><font color="lightgrey">________</font>«<span style="font-size: 10px; line-height: normal"><i>Modératrice.</i></span>»</td></tr></tbody></table><p></p><img src="http://i33.servimg.com/u/f33/17/43/73/02/bannia11.jpg"></div></td></tr><tr><td><div class="slidez"><p></p><div style="margin:auto;text-align:center;width:100%"><strong>?????</strong></div><table><tbody><tr><td><a href="http://LIEN">FICHE</a> ♦ <a href="http://LIEN">MP</a></td><td><font color="lightgrey">________</font>«<span style="font-size: 10px; line-height: normal"><i>Petite phrase descriptive</i></span>»</td></tr></tbody></table><p></p><img src="http://img703.imageshack.us/img703/7563/copied.png"></div></td></tr></tbody></table></center></blockquote></td><td><blockquote style="margin-left:-470px;width:415px;height:300px;background-color:#FFFFFF;border: 3px solid lightgrey;border-radius: 15px 0px 15px 0px;"><span style="text-align:center;white-space: nowrap;font-size:25px;color:lightgrey;font-family: georgia;letter-spacing:5px;"><br></span><blockquote style="width:370px;height:230px;overflow:auto;"><div align="justify"><div style="margin:auto;text-align:center;width:100%"><a href=""></a> </div><iframe src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fforumcinemaniac&width=292&height=290&colorscheme=light&show_faces=true&border_color&stream=false&header=true" style="border:none; overflow:hidden; width:292px; height:290px;" allowtransparency="true" frameborder="0" scrolling="no"></iframe>
</div></blockquote></blockquote></td></tr><tr><td><blockquote style="margin-left:10px;width:250px;height:325px;background-color:#FFFFFF;border: 3px solid lightgrey;border-radius: 15px 0px 15px 0px;"><span style="text-align:center;white-space: nowrap;font-size:25px;color:lightgrey;font-family: georgia;letter-spacing:5px;"><br>Bienvenue</span><br><font size="5"><br></font><marquee scrolldelay="130" onmouseover="this.stop();" onmouseout="this.start();" direction="up" height="210px;" width="210px;"><div align="justify"><div style="text-align: center;"><font size="3">Bienvenue sur CinéManiac, <br>n'hésitez pas à vous inscrire... <br>On a encore jamais mangé personne... <br>Quoi que... <br><br><br><br>Votre forum recrute : <br>*Modérateurs<br>*Codeurs<br>*Graphistes<br>*Animateurs<br>Si l'un de ces postes vous intéresse rendez-vous <a href="http://cinemaniac.lebonforum.com/t578-recrutement#810">"ICI"</a></font></div>

</div></marquee></blockquote></td><td><blockquote style="margin-left:-530px;margin-top:-157px;width:480px;height:150px;background-color:#FFFFFF;border: 3px solid lightgrey;border-radius: 15px 0px 15px 0px;"><br><span style="text-align:center;white-space: nowrap;font-size:25px;color:lightgrey;font-family: georgia;letter-spacing:5px;">Top 5 des Posteurs</span><br><div class="bubulle" style="margin-left:16px;width:70px;height:70px;border:2px solid lightgrey;border-radius:50px; background-image:url('http://img201.imageshack.us/img201/8581/129gw.jpg');"><span style="text-align:center;"><strong>N°1 TonY</strong> ♦ Admin</span></div> <div class="bubulle" style="margin-left:20px;width:70px;height:70px;border:2px solid lightgrey;border-radius:50px; background-image:url('http://img6.imageshack.us/img6/4372/copiede675051569small.jpg');"><span style="text-align:center;"><strong>N°2 rosedesvents</strong> ♦ Admin</span></div> <div class="bubulle" style="margin-left:20px;width:70px;height:70px;border:2px solid lightgrey;border-radius:50px; background-image:url('http://img823.imageshack.us/img823/4923/imgserverphpfile2fimgte.jpg');"><span style="text-align:center;"><strong>N°3 LonelyClarrise</strong> ♦ Modératrice</span></div> <div class="bubulle" style="margin-left:20px;width:70px;height:70px;border:2px solid lightgrey;border-radius:50px; background-image:url('http://img716.imageshack.us/img716/6136/105545001345122124image.jpg');"><span style="text-align:center;"><strong>N°4 littlebylittle</strong> ♦ Membre</span></div> <div class="bubulle" style="margin-left:20px;width:70px;height:70px;border:2px solid lightgrey;border-radius:50px; background-image:url('http://img69.imageshack.us/img69/8835/775bb.jpg');"><span style="text-align:center;"><strong>N°5 Ronald73</strong> ♦ Membre</span></div> </blockquote></td></tr>

<tr><td><blockquote style="margin-left:300px;margin-top:-171px;width:480px;height:150px;background-color:#FFFFFF;border: 3px solid lightgrey;border-radius: 15px 0px 15px 0px;"><span style="text-align:center;white-space: nowrap;font-size:25px;color:lightgrey;font-family: georgia;letter-spacing:5px;"><br>PARTENAIRES</span><br>
<marquee scrolldelay="130" onmouseover="this.stop();" onmouseout="this.start();" direction="left" <a="" href="URLFOFO"><span class=""><img src="" style="widht:40px; height:40px;"></span> <a href="http://www.wombatah.com"><span class=""><img src="http://i49.servimg.com/u/f49/15/49/30/85/logo1010.gif" style="widht:40px; height:40px;"></span></a> <a href="http://flashinpub.forumgratuit.org/"><span class=""><img src="http://upload.yamalandia.com/rep1/198031331022.gif" style="widht:40px; height:40px;"></span></a> <a href="http://the-simpsons-pub.exprimetoi.net"><span class=""><img src="http://img4.hostingpics.net/pics/676854part80simpson.jpg" style="widht:40px; height:40px;"></span></a> <a href="http://www.twilighters-france.net"><span class=""><img src="http://img819.imageshack.us/img819/5966/11032812363910175678956.png" style="widht:40px; height:40px;"></span></a> <a href="http://www.melodie-pub.net/"><span class=""><img src="http://i42.servimg.com/u/f42/17/02/12/65/bouton11.gif" style="widht:40px; height:40px;"></span></a></marquee></blockquote></td></tr>
<tr><td><blockquote style="margin-left:20px;width:750px;height:70px;background-color:#FFFFFF;border: 3px solid lightgrey;border-radius: 15px 0px 15px 0px;"><span style="text-align:center;white-space: nowrap;font-size:15px;color:lightgrey;font-family: georgia;letter-spacing:5px;"><br>CREDITS</span><br>
<marquee scrolldelay="130" onmouseover="this.stop();" onmouseout="this.start();" direction="left" height="50px;" width="720px;"> <i>Forum réalisé par</i> TonY; <i>Graphisme réalisé par</i> rosedesvents; <i> <strong><i>Page d’accueil réalisé par</i> <a href="http://epicode.bbactif.com/u52">UMI</a> sur <a href="http://epicode.bbactif.com/">Epicode</a></strong>; <i>Contenu réalisé par</i> rosedesvents / TonY; <i>Réglement réalisé par</i> rosedesvents / TonY <span style="font-size: 9px; line-height: normal"></span>.</i></marquee></blockquote></td></tr></tbody></table>
</div>

[ /hide]

Et celui du CSS:

[ hide]

Code:: #page-body { padding-top: 50px;}
/* Image slide */

.slidez {
position: relative;
overflow:hidden;
height: 50px;
width: 265px;
background: lightgrey; /* Couleur fond image slide */
color: #000000; /* Couleur écriture image slide */
margin-top: 2px;
border: 1px dotted white; /* Épaisseur, style, couleur bordure image slide */
}

.slidez img{
position: absolute;
left: 0;
top: 0;
transition: transform 3s;
-moz-transition: -moz-transform 4s;
-o-transition: -o-transform 4s;
-webkit-transition: -webkit-transform 4s; }

.slidez:hover img{
transform: translateY(+208px);
-moz-transform: translateY(+208px);
-o-transform: translateY(+208px);
-webkit-transform: translateY(+208px);
}

/* TOGGLE OPACITE - A NE PAS TOUCHER */

.toggleopacity {
filter:alpha(opacity=50);
-moz-opacity:0.5;
-khtml-opacity: 0.5;
opacity: 0.5;
-moz-transition : all 1s;
-webkit-transition : all 1s;
}

.toggleopacity:hover {
filter:alpha(opacity=100);
-moz-opacity:1;
-khtml-opacity: 1;
opacity: 1;
-moz-transition : all 1s;
-webkit-transition : all 1s;
}

div.bubulle {
position: relative;
float: left;
}

div.bubulle span {
display: none;
}
div.bubulle:hover {
background: none;
z-index: 999;
}

div.bubulle:hover span {
width: 150px;
display: inline;
position: absolute;
top: Ypx;
left: Xpx;
background-color: #FFFFFF; /* Couleur fond infobulle PV */
color: #000000; /* Couleur texte infobulle PV */
padding: 2px;
border: 2px solid lightgrey; /* Épaisseur, style, couleur contour infobulle PV */
border-radius: 15px;
}

div.boutons {
width:120px;
height:20px;
background-color:#FFFFFF; /* Couleur fond bouton navig rapide */
border: 3px solid lightgrey; /* Épaisseur, style, couleur contour bouton navig rapide */
border-radius: 15px 0px 15px 0px;
text-align:center
}

[ /hide]

Sujet: Re: Probleme affichage P.A pour Internet Explorer Mar 04 Sep 2012, 12:00

Il ne faut pas mettre border-radius seulement :

Code:: -webkit-border-radius: 15px;
-moz-border-radius: 15px;
border-radius: 15px;

Sujet: Re: Probleme affichage P.A pour Internet Explorer Mar 04 Sep 2012, 12:16

Ce que soulève Hiro d'une part est une excellente remarque.

Cependant, en ce qui concerne ton problème malheureusement, j'ai bien peur de devoir te dire qu'il ne va pas y avoir de solution simple.
Pour commencer, tout simplement, de quelle version d'Internet Explorer s'agit-il ? A savoir qu'IE version 8 et antérieur ne supportent tout simplement pas la propriété border-radius. A compter de la version 9 en revanche, ça s'améliore.

Voici un tableau de compatibilité des navigateurs avec les propriétés CSS 3 / HTML 5 pour se faire une idée : http://www.findmebyip.com/litmus/

Si donc c'est sous IE 8 ou 7 que tu souhaite que ton effet fonctionne, il faut passer par d'autres techniques bien plus fatiguantes (à savoir d'avoir des images qui sont elles arrondies). Bref, généralement on ne se préoccupe pas de cela. Les gens qui sont encore sous Internet Explorer 7 ou 8 (encore une partie des utilisateurs d'IE, mais ça se réduit de jour en jour) ne connaissent pas exactement le web tout beau tout propre et arrondi que les utilisateurs de Chrome, Opéra, Firefox (et IE 9) connaissent. Bref, ils ne seront pas si choqués donc évitez de vous prendre la tête pour eux Wink