css clean pour ie Fermé

Question

Bonjour, 
j'aimerai savoir si il existe un moyen simple d'avoir des css clean pour internet explorer?
actuellement le site en question est nickel pour firefox mais sacrément buggé pour ie...

voilà le css qui est appelé:
body {
	color: #fff;
	background: url(../img/bg.png) repeat fixed 50% 0;
  margin: 0; /* pour éviter les marges */ 
  text-align: center;
	font: 12px "Lucida Grande", Lucida, Verdana, sans-serif;
}

#page {
	width: 1090px; 
    text-align: left;
	height: auto;
	margin-left: auto;
	margin-right: auto;
	background: rgba(0,0,0,0.25) 0 bottom;
	padding-left: 10px;
	padding-bottom: 5px;
}

#head {
	height: 100px;
	float: left;
	width: 1045px;
	padding: 30px 0 0 30px;
	background-position: 0 center;
}

#news {
	width: 1075px;
	height: auto;
	margin-bottom: 10px;
}

#gauche {
	margin-right: 5px;
	padding: 10px;
	width: 550px;
	margin-bottom: 10px;
	height: auto;
	overflow: auto;
	float: left;
	text-decoration: none;
	font: normal normal 12px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	/* offset left, top, thickness, color with alpha */
	-webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
	box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
/* IE */
	filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='black');
/* slightly different syntax for IE8 */
	-ms-filter:"progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='black')";
	background-image: url(../img/trans_bg.png);
}

#droite1 {
	padding: 10px;
	width: 475px;
	height: 300px;
	float: right;
	margin-bottom: 10px;
	background: url(../img/trans_bg.png) right;
	/* offset left, top, thickness, color with alpha */
	-webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
	box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
/* IE */
	filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='black');
/* slightly different syntax for IE8 */
	-ms-filter:"progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='black')";
	color: white;
                font-size:x-small;
                font-weight:bold;
	font-style: normal;
}

#avance {
	padding: 10px;
	width: 225px;
	height: 350px;
	float: left;
	margin-bottom: 10px;
	background: url(../img/trans_bg.png) right;
	/* offset left, top, thickness, color with alpha */
	-webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
	box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
/* IE */
	filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='black');
/* slightly different syntax for IE8 */
	-ms-filter:"progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='black')";
	margin-left: 5px;
}

#wwy {
	padding: 10px;
	width: 220px;
	float: right;
	margin-bottom: 10px;
	background: url(../img/trans_bg.png) right;
	/* offset left, top, thickness, color with alpha */
	-webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
	box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
/* IE */
	filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='black');
/* slightly different syntax for IE8 */
	-ms-filter:"progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='black')";
	margin-left: 10px;
	height: 350px;
}

#bluetracker {
	width: 475px;
	float: right;
	margin-bottom: 10px;
	background: url(../img/trans_bg.png) right;
	/* offset left, top, thickness, color with alpha */
	-webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
	box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
/* IE */
	filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='black');
/* slightly different syntax for IE8 */
	-ms-filter:"progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='black')";
	height: auto;
	padding: 10px;
}

#wwyimg {
	float: right;
	height: auto;
	z-index: 300;
	width: 50px;
}
#guideimg {
	position: absolute;
	float: right;
	margin-left: 1000px;
}

#tete {
	height: 25px;
	margin-bottom: 10px;
	background: url(../img/bg_menu.jpg) repeat-x;
	width: 150px;
}

#foot {
	clear:both;
	padding: 10px;
	height: 100px;
	margin-bottom: 0;
	width: 1055px;
	margin-top: 10px;
	/* offset left, top, thickness, color with alpha */
	-webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
	box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
/* IE */
	filter:progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='black');
/* slightly different syntax for IE8 */
	-ms-filter:"progid:DXImageTransform.Microsoft.dropshadow(OffX=5, OffY=5, Color='black')";
	background-image: url(../img/trans_bg.png);
}

a:link{
	color: orange;
	text-decoration: none;
}
 a:hover{
	color: #ee4820;
	text-decoration: none;
}
a:active{
	color: orange;
	text-decoration: none;
}
a:visited {
	color: #ee4820;
	text-decoration: none;
}

h1 {
	font: italic bold 16px/16px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	border-bottom-style: solid;
	border-bottom-width: 1px;
}
td {
	font-size: 10px;
	font-weight: bold;
}


merci



Configuration: Mac OS X / Firefox 3.6.4

Breub62 · Answer

Lien magique ;-)


http://esprit-creatif.blog.mongenie.com/index.php?idblogp=406297

vincentdu76 · Answer

-webkit-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);
	box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.5);


Ca je crois que ça passe pas pour IE...

ariup · Answer

en fait c'est pas trop le pb des ombres, ça je sais, le pb c'est surtout les div qui se placent n'importe ou!

vincentdu76 · Answer

Il ne doit pas aimer les auto, ou alors il les gère differement de FF.

height: auto;

Css clean pour ie

4 réponses

Discussions similaires