Problemas con Internet Explorer y Opera

Hola, puede que esto ya lo hayan respondido, pero no lo pille...

Estoy haciendo una pagina, use css3 para hacer un slideshow con efectos, en Firefox, Chrome y Safari se ve todo bien, pero Opera el footer no se queda fijo abajo a la izquierda, pero lo peor queda con internet explorer... En IE9 no se ve el slideshow y en IE8 no se ve el header y el slide de una pagina interior se ve horrible.

Ok, se que IE no sirve de nada y es lo peor, pero me sorprendio Opera.

Lo mas feo es que mis clientes usan IE y hoy, cuando la presente para el penultimo visto bueno, quede pesimo y me retaron.

Pueden verla en www.acrecer.cl/index.html

Saludos y gracias

Lo único que te aconsejo es que revises bien tus margenes y tus elementos flotantes. Dicen que un buen código no necesita modificaciones para otros navegadores (por lo menos entre FF, Chrome y Opera), así que revisa o vuelve a escribir.

Suerte con eso.

Estás usando tablas para diseñar (mal hecho) cuando lo podías haber resuelto con cuatro divs... en fin.
Dices que usas CSS3, bien, pero no estás usando HTML5.
Como te han dicho, tu problema son los márgenes. Yo te aconsejo que cargues un CSS Reset y no uses tablas como base del diseño.

Gracias por las ayudas, pero el cuento no va con las tablas, las probe en localhost con divs y pasa lo mismo, que hago???

Cierto, el tema no va con las tablas sino con lo que ya te hemos dicho: tienes problemas con los márgenes y rellenos (paddings).

Te aconsejo que apliques un CSS Reset y vuelve a desarrollar la página, de lo contrario seguirás teniendo problemas de renderizado entre navegadores.

Sin resets y con divs. Usa esto de plantilla. No digas nunca que algo no se puede hacer.

CSS

Código :

#header {
   width: 1300px;
   height: 150px;
   background: peru;
}
#contenedor {
   width: 1300px;
   height: auto;
}
#sidebar {
   float: left;
   width: 300px;
   height: 100%;
   background: red;
}

#contenido {
   float: right;
   width: 990px;
   height: 100%;
   background: blue;
}

#footer {
   width: 1300px;
   height: 50px;
   text-align: center;
   position: fixed;
   bottom: 0;
}
#footer p {
   width: 100px;
   height: 50px;
   background: black;
   color: white;
   float: right;
}

HTML

Código :

<div id="header"></div>
<div id="contenedor">
   <div id="sidebar"></div>
   <div id="contenido"></div>
</div>
<div id="footer"><p>Footer</p></div>