menu se descuadra en explorer 8

[cristo995]

buen dia..

tengo el siguiente problema. tengo un menu que ps se ve bien en mozilla chrome Ie 9 Ie 10 etcc

pero se me dio por mirar en Ie 8 y fassssss el menu se me echa hacia un lado y se me sale del contenedor..

pueden ver la pagina aqui:
http://webmarket.com.co/consultores/


HTML.

Código HTML:

<div class="menu-sup">
    <img src="img/ralla-menu.png" alt="">
      <ul class="submenu">
        <li class="lh"><a href="#">Inicio <span class="separador"></span></a></li> 
        <li class="lh"><a href="#">Quienes somos <span class="separador"></a></li>
        <li class="sub-menu"><a href="#">Portafolio<br>de servicios <span class="separador"></a>
            <ul>
                <li><a href="#">Acompañamiento en procesos operativos</a></li>
                <li><a href="#">Acompañamiento en procesos de atención a clientes</a></li>
                <li><a href="#">Acompañamiento en procesos de capacitación</a></li>
            </ul>   
        </li>
        <li><a href="#">Capacítese<br>con nosotros <span class="separador"></a></li>
        <li class="lh"><a href="#">Trabaje en el sector <span class="separador"></a></li>
        <li class="sub-menu sub-menu2"><a href="#">Aliados<br>estrategícos <span class="separador"></a>
            <ul>
                <li><a href="#">Aliado1</a></li>
                <li><a href="#">Aliado2</a></li>
                <li><a href="#">Aliado3</a></li>
            </ul>
        </li>
        <li class="lh"><a href="#">Contáctenos</a></li>
      </ul>
      <div class="limpiar"></div>
    </div>
 

_____________________________
y aquie el CSS correspondiente:

CSS:

Código CSS:

<div.menu-sup {
  width: 900px;
  height: 43px;
  position: absolute;
  bottom: 0px;
  right: 0px;
}
div.menu-sup img {
  position: absolute;
  right: 0px;
  bottom: 0px;
}
div.menu-sup ul {
  float: right;
}
div.menu-sup li {
  margin-right: 28px;
  position: relative;
  line-height: 13px;
  padding-top: 7px;
  border-top: 3px solid #4b192d;
}
div.menu-sup li:hover {
  border-top: 3px solid #ef8711;
}
div.menu-sup li.lh {
  line-height: 20px;
}
div.menu-sup a {
  font-size: 13px;
  color: white;
  font-family: "TitilliumText25L002";
}
div.menu-sup a:hover {
  color: #ef8711;
}
div.menu-sup span.separador {
  width: 1px;
  height: 18px;
  border-right: 1px solid #87294d;
  position: absolute;
  top: 13px;
  right: -15px;
}
div.menu-sup li.sub-menu ul {
  display: block;
  position: absolute;
  z-index: 2;
  margin-left: -120px;
  margin-top: 1px;
}
div.menu-sup li.sub-menu ul li {
  clear: left;
  width: 325px;
  padding: 0px;
  border: 0px;
  border: 1px solid #fd8b1c;
  border-top: 0px;
  border-bottom: 1px solid #f29f41;
  background: #eef2fa;
  text-align: center;
}
div.menu-sup li.sub-menu ul li:hover {
  border: 0px;
  background: #4b192d;
  color: white !important;
}
div.menu-sup li.sub-menu ul li a {
  line-height: 35px;
  color: black!important;
  display: block;
}
div.menu-sup li.sub-menu ul li a:hover {
  color: white!important;
  border-top: 1px solid #fd8b1c;
}
div.menu-sup li.sub-menu2 ul {
  margin-left: -74px;
}
div.menu-sup li.sub-menu2 ul li {
  width: 140px;
}
 

ps no se ni idea por q se me descuelta este putin menu

[cristo995]

:) ya esta solucionado .. jeje

el problema era que solo el primer <span> estaba cerrado </span> y los otros No. jej

solo los cerre y listo