me rindo con internet explorer 8 >:v

[ZeroRcp]

bueno si la verdad me rindo con internet explorer 8, la verdad quizas para muchos no sea complejo, pero odio al momento de programar algun css, porque papi explorer destruye todo...
pero quejarme aqui no es mi objetivo...
la verdad estoy haciendo un menu para internet explorer, pero da la grandiosa casualidad que despues de colocar el siguiente codigo:

Código (css) [Seleccionar] Expandir

body{
   background: #ededed;
   margin:0;
   padding:0;
}

#menu_wrap{
   position:relative;
   margin-top:20px;
   margin-left:auto;
   margin-right:auto;
   padding:0;
   padding-right:0px;
   width:100%;
   height:57px;
   list-style-type:none;
   -webkit-border-radius:0px;
   -moz-border-radius:0px;
   border-radius:0px;
   -webkit-box-shadow:0 1px 3px rgba(0,0,0,.2);
   -moz-box-shadow:0 1px 3px rgba(0,0,0,.2);
   box-shadow:0 1px 3px rgba(0,0,0,.2)
}

.button a{
   cursor:pointer;
   text-align:center;
   font:15px/100% Arial, Helvetica, sans-serif;
   font-weight:bold;
   position:relative;
   min-width:50px;
   height:20px;
   float:left;
   padding:10px;
   padding-top:18.5px;
   padding-bottom:18.5px;
   text-decoration:none;
   text-shadow:0 1px 1px rgba(0,0,0,.3)
}

.button:first-child a{
   -webkit-border-top-left-radius:0px;
   -webkit-border-bottom-left-radius:0px;
   -moz-border-topleft-radius:0px;
   -moz-border-bottomleft-radius:0px;
   border-top-left-radius:0;
   border-bottom-left-radius:0px;
}

.Orange,.Orange .button a{
   color:#fef4e9;
   background: #f9bc59;
   border-right:solid 1px #f27c21;
   background: -moz-linear-gradient(top, #f9bc59 0%, #f27c21 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f9bc59), color-stop(100%,#f27c21));
   background: -webkit-linear-gradient(top, #f9bc59 0%,#f27c21 100%);
   background: -o-linear-gradient(top, #f9bc59 0%,#f27c21 100%);
   background: -ms-linear-gradient(top, #f9bc59 0%,#f27c21 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f9bc59', endColorstr='#f27c21',GradientType=0 );
   background: linear-gradient(top, #f9bc59 0%,#f27c21 100%);
}

.Orange .button a:hover,.Orange .button a:focus{
   background: #f88e11;
   background: -moz-linear-gradient(top, #f88e11 0%, #e25300 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f88e11), color-stop(100%,#e25300));
   background: -webkit-linear-gradient(top, #f88e11 0%,#e25300 100%);
   background: -o-linear-gradient(top, #f88e11 0%,#e25300 100%);
   background: -ms-linear-gradient(top, #f88e11 0%,#e25300 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f88e11', endColorstr='#e25300',GradientType=0 );
   background: linear-gradient(top, #f88e11 0%,#e25300 100%);
}

.Orange .button a:active{
   color:#fcd3a5;
   background: #f47a20;
   background: -moz-linear-gradient(top, #f47a20 0%, #faa51a 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f47a20), color-stop(100%,#faa51a));
   background: -webkit-linear-gradient(top, #f47a20 0%,#faa51a 100%);
   background: -o-linear-gradient(top, #f47a20 0%,#faa51a 100%);
   background: -ms-linear-gradient(top, #f47a20 0%,#faa51a 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f47a20', endColorstr='#faa51a',GradientType=0 );
   background: linear-gradient(top, #f47a20 0%,#faa51a 100%);
}

.button:last-child a{
   float:left;border:none;
   -webkit-border-top-right-radius:0px;
   -webkit-border-bottom-right-radius:0px;
   -moz-border-radius:0px;
   border-top-right-radius:0px;
   border-bottom-right-radius:0px
}

en explorer la obra maestra me aparece esto

un menu completamente disvariado y desacomodado como si fuera en escalera.... no se como enviar una imagen aqui para que lo vieran, pero se ve mal...
me pueden decir si es error del codigo o que debo hacer?


Mod: Los códigos deben ir en etiquetas GeSHi

[engel lex]

puedes splicar los comentarios macro de IE

para el css normal (no ie)

Código (html4strict) [Seleccionar] Expandir

<!--[if !IE]><!-->
aqui tu css normal
<!--<![endif]-->

para IE

Código (html4strict) [Seleccionar] Expandir

<!--[if IE]>
css para el navegador especialito
<![endif]-->


es preferible hacerlos por separado, que junto