Utilização De Classe

[olimpia]

Tenho o seguinte HTML

<div class="x-horizontal-menubar" >
  <ul class="x-menu-list">
    <li class="x-menu-list-item">
     <a href="#" class="x-menu-item-arrow" >
     Menu 1
     </a>
    </li>
    <li class="x-menu-list-item">
     <a href="#" class="x-menu-item-arrow" />
     Menu 2
    </li>
  </ul>
</div>

Estou usando o css abaixo para formata-lo

.x-horizontal-menubar { 
   background-color:#deecfd;   
   width:100%!important; 
   border-left:0px none; 
   border-right:0px none;    
} 
.x-horizontal-menubar > .x-menu-list  {    
   margin:0; 
   padding:0;    
   float:left; 
   width:100%; 
   border-left:0px none; 
   border-right:0px none; 
} 
.x-horizontal-menubar > .x-menu-list > .x-menu-list-item { 
    background-image:none;
    float:left;
    display:inline;                                            
    margin-left:10px;
    padding-left:0px;
    padding-right:10px;
    text-decoration:none;
    background-color:#000000
}

No Firefox esta ficando da maneira que preciso, segue a imagem

Mas no IE 6 ( não testei no IE 7 ) não da certo, segue a imagem

O que devo fazer para que no IE funcione corretamente ?

O IE não aceita o >.

Mas fui auxiliado a utilizar o nome da classe principal mais o elemento, segue o link completo

.

[KaKarotto]

Olimpia, simples, se não funciona no ie6 o ">", oras, não o use...Não uso o ie7, mas sei que seu código funcionaria sem problemas pois ele já vem com suporte a esse seletor.

Vai perceber que seu site vai ficar distorcido quando fizer para firefox e ie7, e for abrir em ie6, pode tentar burlar isso usando o que o ie6 "enxerga" antes. Assim:

body{

background:pink;

}

html>body{background:black}

Dessa forma, todos os browsers descentes ficariam com o fundo preto, enquanto os indecentes, como o ie6, ficariam com o fundo rosa. Todos ficariam rosa a principio mas mudam com o código posterior, como o ie6 não encherga o seletor "<" ele é o único que permaneceria rosa.

Sacou? Abraços.