Se connecter / S'enregistrer
Votre question

Problème de compatibilité CSS avec IE

Tags :
  • Arrière plan
  • Programmation
Dernière réponse : dans Programmation
20 Février 2007 09:59:16

Hello à tous alors voilà j'ai un problème de compatibilité avec mon CSS dans internet explorer se problème n'es bien evidement pas sur firefox. Je me suis renseigné sur différent forum pour voir les problème possible et j'ai vu que IE est une vrai &#{}@ (c'est pas nouveau) alors la question est voyez vous des solution à mon problème ? (css disponible à cette adresse : http://phpnet.org/panel_v3/style.css)
Merci de votre aide :-)

Citation :

body{
background:#E7ECFF url(img/bodybg.gif) repeat;
color:#505050;
font:82% Verdana,Tahoma,Arial,sans-serif;
margin:0;
padding:0;
text-align:center;
}

p{
line-height:20px;
margin:0 0 15px;
}

a{
color:#3E80B4;
font-weight:700;
text-decoration:none;
}

a:hover{
color:#d04a10;
}

hr{
height:1px;
margin:10px 0;
width:98%;
}

dt{
font-weight:700;
}

dd{
margin:1px 0 12px 15px;
}

#container{
background:#E7ECFF ;
margin:0 auto;
text-align:left;
width:952px;
}

#sitename{
background:url(img/leaves.jpg) top center no-repeat;
color:#ffffff;
font-weight:400;
height:100px;
margin:0 0px 4px 0;
text-align:center;
}

#sitename h1{
font-size:29px;
margin:0;
padding-top:20px;
}

#sitename span{
font-size:21px;
letter-spacing:-1px;
margin:0;
}

#nav{
background:url(img/greypx.gif) bottom left repeat-x;
float:left;
width:952px;
}

#nav ul{
list-style:none;
margin:0;
padding:0;
}

#nav a{
background:url(img/tabs.gif) no-repeat 100% 0;
color:grey;
display:block;
font-size:16px;
letter-spacing:-1px;
padding:7px 20px 4px 11px;
text-decoration:none;
}

#nav a:hover{
color:#505050;
}

#nav li{
background:url(img/tabs.gif) no-repeat 0 0;
float:left;
margin:0 4px 0 0;
padding:0 0 0 9px;
}

#nav #current{
background:url(img/tabs.gif) no-repeat 0 -41px;
}

#nav #current a{
background:url(img/tabs.gif) no-repeat 100% -41px;
color:#303030;
padding:7px 20px 5px 11px;
}

#wrap1{
background:#ffffff url(img/innerbg.gif) repeat-y;
border-bottom:1px solid #808080;
border-left:1px solid #808080;
border-right:1px solid #808080;
clear:both;
padding:0;
width:950px;
}

#wrap2{
background:url(img/header.jpg) top left no-repeat;
padding:10px;
width:930px;
}

#header{
height:30px;
position:relative;
width:930px;
}

#header h1{
float:left;
font-size:19px;
margin:0;
width:180px;
}

#topbox{
color:#808080;
margin:0 0 4px;
text-align:right;
}

#topbox a{
color:#3E80B4;
}

#topbox a:hover{
text-decoration:underline;
}

#leftside{
float:left;
margin:-20px 0 0;
width:210px;
}

#leftside h1{
font-size:19px;
font-weight:400;
}

#rightside{
float:right;
margin:40px 15px 20px 0;
width:75px;
}

#rightside h1{
font-size:19px;
font-weight:400;
margin:0 0 12px;
}

#rightside p{
font-size:13px;
margin:2px 0 12px 10px;
}

#rightside img{
border:1px solid #3E80B4;
margin:10px 0 5px 5px;
padding:2px;
}

#content{
margin:45px 40px 0 240px;
}

#contentalt{
margin:45px 15px 0 180px;
}

#content p,#contentalt p{
margin:8px 0 0 10px;
}

#content h1,#contentalt h1{
color:#505050;
font-size:27px;
font-weight:400;
margin:15px 0 10px;
padding:0;
}

#content h2,#contentalt h2{
color:#505050;
font-size:20px;
font-weight:400;
margin:20px 0 10px;
padding:0;
}

#footer{
clear:both;
color:#a0a0a0;
font-size:12px;
height:26px;
margin-top:20px;
padding:1px;
text-align:right;
width:930px;
}

#footer a{
color:#a0a0a0;
font-weight:400;
}

#footer a:hover{
color:#a0a0a0;
text-decoration:underline;
}

.menublock{
margin-bottom:10px;
}

.nav{
color:#FFFFFF;
display:block;
font-size:15px;
font-weight:700;
margin-bottom:0;
padding:0px 0px 0px 5px;
position:relative;
text-decoration:none;
width:170px;
}

.nav:hover{
color:#505050;
padding:0px 0px 0px 5px;
}

.sub{
font-size:12px;
margin-left:20px;
padding:1px 1px 1px 6px;
width:105px;
}

.sub:hover{
border:1px solid #3E80B4;
color:#505050;
padding:0 0 0 5px;
}

.intro{
font-weight:700;
}

.active{
border:1px solid #3E80B4;
padding:1px 1px 1px 9px;
}

.box{
background:#f8f8f8 url(img/boxbg.gif) top left repeat-y;
border:1px solid #3E80B4;
color:#505050;
margin:15px auto;
padding:10px 10px 10px 20px;
width:75%;
}

.photo{
margin:5px auto 15px;
padding:5px;
}

.smallcaps{
font-variant:small-caps;
}

.mini{
color:#a0a0a0;
font-size:10px;
font-weight:400;
line-height:16px;
margin:20px 0 10px 8px;
}

.small{
font-size:11px;
}

.large{
font-size:19px;
}

.soft{
color:#FFFFFF;
}

.normal{
font-weight:400;
}

.sharp{
color:#101010;
}

.center{
text-align:center;
}

.hide{
display:none;
}

Autres pages sur : probleme compatibilite css

20 Février 2007 10:35:33

Euh c'est quoi le problème au juste?
20 Février 2007 10:41:38

En fait j'ai fait une image sous photoshop et ensuite grace au css j'ai inclu du texte sur ces images (le but du css) tout va bien sous firefox mais sous IE les images sont agrandi le texte est au même endroit mais les images partent n'importe où.

En regardant sur des sites j'ai repéré que les erreurs viennent surement des width ; padding ; border ; margin que IE soustrait au lieu d'additionné comme tout navigateur alors il existe des solutions mais je les trouvent pas :-(
Contenus similaires
20 Février 2007 11:01:49

Hum je comprend pas du tout se qu'il explique :-D
20 Février 2007 11:05:00

Si ton site est en php , regarde pour manipuler ton image avec la lib gd2 .
20 Février 2007 11:11:28

Je veu bien mais par contre qu'es-ce que la lib gd2?
20 Février 2007 11:23:45

Je vais me répéter ^^

La librairire gd2 , qui normalement est déjà présente sur ton serveur apache/php ( si bien sur tu fais un site en php ) , doit etre activé dans le php.ini (par défault il se trouve dans un commentaire ) .

Cette librairie te permet de faire pas mal de traitement sur les images et te permets également d'insérer du texte sur une image en spécifiant la position ,la taille etc ... Ce n'est la qu'une infime partie des possibilités de cette librairie.

Si ma mémoire ne me fait pas défaut , un tuto est disponible sur le site du zero .

Un exemple parle plus qu'une explication parfois ;) 


edit: Arf , j'uploaderais ce soir en revenant du boulot l'image générée avec gd2 , il semblerait que mon hebergement à pris fin xD
20 Février 2007 11:25:12

merci bien je vai voir se que ça donne ;) 

PS: Ton lien est mort
20 Février 2007 11:27:31

Ouais ^^ Je viens de le remarquer sniff
Tom's guide dans le monde
  • Allemagne
  • Italie
  • Irlande
  • Royaume Uni
  • Etats Unis
Suivre Tom's Guide
Inscrivez-vous à la Newsletter
  • ajouter à twitter
  • ajouter à facebook
  • ajouter un flux RSS