ayuda con mi web

[yoda655]

Saluten, necestio vuestra ayuda hemos montado una web en php-nuke, y de pie, utilice un codigo javascript ke carga 2 css, pero da un problema con los ie8 los visualiza todo horrible, pero con crone y firefox lo hay ningun problema, pero la verdad he tratado de ver el codigo y modificarlo y nada, no se tanto de css ayuda por favor os pongo el código: de los dos css

//moostyle
#rokslide-wrapper .tab-pane .padding {
padding: 10px;
}

#rokslide-wrapper {
background: url(../images/bottom-bg.png) 0 0 repeat-x;
}

#rokslide-toolbar li.active {
color: #FFF;
}

#rokslide-toolbar li.current {
background: url(../images/tab-active-r.png) 100% 0 no-repeat;
color: #ccc;
}

#rokslide-toolbar li.current span {
background: url(../images/tab-active-l.png) 0 0 no-repeat;
}

#rokslide-toolbar li {
background: url(../images/tab-r.png) 100% 0 no-repeat;
color: #999;
}

#rokslide-toolbar li span {
background: url(../images/tab-l.png) 0 0 no-repeat;
}

div#frame {
text-align: left;
}

div#frame div.button#left {
background: url(../images/tabs-prev.png) 0 0 no-repeat;
}

div#frame div.button#right {
background: url(../images/tabs-next.png) 0 0 no-repeat;
}

#frame div.module {
#float: left;
}

#frame .module div {
#padding-right: 10px;
}

#frame .module div div {
#padding: 0;
}


#frame .mmpr-1 .module {
#width: 100%;
}

#frame .mmpr-2 .module {
#width: 50%;
}

#frame .mmpr-3 .module {
#width: 33%;
}

#frame .mmpr-4 .module {
#width: 25%;
}

#frame .mmpr-5 .module {
#width: 20%;
}

/* @end */

a.nounder {
#text-decoration: none;
#border: 0;
#cursor: pointer;
}

a.nounder:hover {
#text-decoration: none;
}

a img.album {
#border-width: 2px;
#border-style: solid;
}

.clr {
#clear:both;
}

fieldset.input {
#border: 0;
}

a img {
#border: 0;
}

img.content-left {
#float: left;
margin-right: 10px;
padding: 5px;
border: 1px solid #252525;
}

img.content-right {
#float: right;
margin-left: 10px;
padding: 5px;
border: 1px solid #252525;
}

.tool-tip {
background: #101010;
border: 1px solid #202020;
padding: 4px;
color: #ccc;
}

//rokslidestrip

hr {
clear: both;
height: 0;
border: 0;
#display: none;
}

/* The toolbar for the content box */
#rokslide-wrapper del {
text-decoration: none;
clear: both;

}

ul#rokslide-toolbar {
display: table;
padding: 0;
margin: 0 auto;
list-style-type: none;
white-space: nowrap;
}


#rokslide-toolbar li {
display: table-cell;
height: 33px;
line-height: 33px;
font-weight: bold;
}

#rokslide-toolbar span {
cursor: pointer;
padding: 0 19px 0 15px;
display: block;
width: auto;
text-decoration: none;
}

div#frame {
clear: both;
position: relative;
overflow: hidden;
z-index: 1;
}

div#frame div.button {
position: absolute;
width: 50px;
height: 50px;
cursor: pointer;
overflow: hidden;
top: 40%;
}

div#frame div.button#left {
left: 10px;
}

div#frame div.button#right {
right: 10px;
}

div#frame div.button#left:hover, div#frame div.button#left.hover,
div#frame div.button#right:hover, div#frame div.button#right.hover{
background-position: 0 -50px;
}

#scroller {
margin: 0 auto;
overflow: hidden;
}

.tab-pane {
margin: 0 20px;
float: left;
overflow: hidden;
}


Esto en los IE hace los botones a un lado todo los descuadra.
De antemano gracias