[Resolvido] barra de rolagem ñ funciona

[11closed 0]

ola

 

estou criando uma barra de rolagem dentro de uma div mas ela ñ esta funcionando

 

olha

 

essa é a div

<div id="pesquisar"> 
 <ul>
  <li><a href="painel.php" title="Inicio" >Inicio</a></li>
  <li><a href="perfil.php" title="Alterar Perfil" >Perfil</a></li>
  <li><a href="pesquisar.php" title="Pesquisa no banco de dados">Pesquisar</a></li>
  <li><a href="sair.php" title="Sair da área administrativa">Sair</a></li>
  <li><a href="painel.php" title="Inicio" >Inicio</a></li>
  <li><a href="perfil.php" title="Alterar Perfil" >Perfil</a></li>
  <li><a href="pesquisar.php" title="Pesquisa no banco de dados">Pesquisar</a></li>
  <li><a href="sair.php" title="Sair da área administrativa">Sair</a></li>
  <li><a href="painel.php" title="Inicio" >Inicio</a></li>
  <li><a href="perfil.php" title="Alterar Perfil" >Perfil</a></li>
  <li><a href="pesquisar.php" title="Pesquisa no banco de dados">Pesquisar</a></li>
  <li><a href="sair.php" title="Sair da área administrativa">Sair</a></li>
    <li><a href="painel.php" title="Inicio" >Inicio</a></li>
  <li><a href="perfil.php" title="Alterar Perfil" >Perfil</a></li>
  <li><a href="pesquisar.php" title="Pesquisa no banco de dados">Pesquisar</a></li>
  <li><a href="sair.php" title="Sair da área administrativa">Sair</a></li>
    <li><a href="painel.php" title="Inicio" >Inicio</a></li>
  <li><a href="perfil.php" title="Alterar Perfil" >Perfil</a></li>
  <li><a href="pesquisar.php" title="Pesquisa no banco de dados">Pesquisar</a></li>
  <li><a href="sair.php" title="Sair da área administrativa">Sair</a></li>
    <li><a href="painel.php" title="Inicio" >Inicio</a></li>
  <li><a href="perfil.php" title="Alterar Perfil" >Perfil</a></li>
  <li><a href="pesquisar.php" title="Pesquisa no banco de dados">Pesquisar</a></li>
  <li><a href="sair.php" title="Sair da área administrativa">Sair</a></li>
    <li><a href="painel.php" title="Inicio" >Inicio</a></li>
  <li><a href="perfil.php" title="Alterar Perfil" >Perfil</a></li>
  <li><a href="pesquisar.php" title="Pesquisa no banco de dados">Pesquisar</a></li>
  <li><a href="sair.php" title="Sair da área administrativa">Sair</a></li>
    <li><a href="painel.php" title="Inicio" >Inicio</a></li>
  <li><a href="perfil.php" title="Alterar Perfil" >Perfil</a></li>
  <li><a href="pesquisar.php" title="Pesquisa no banco de dados">Pesquisar</a></li>
  <li><a href="sair.php" title="Sair da área administrativa">Sair</a></li>
 </ul>
</div>

e esse é o css

#pesquisar {
 width:915px;
 height:50px;
 background:#FF0000;
 margin:5px 0px 0px 90px;
 overflow-x: scroll;
 overflow-y: hidden;
}
#pesquisar ul li {
 display:inline;
 margin:0px 0px 0px 5px;
}

Eu quero que so a linha horizontal funcione a vertical ñ poq a largura da div ja esta automatica.

os links inline quando eles chegam no final pula uma linha, quero que continua reto.

 

t+

[Evandro Oliveira 331]

para os links inline continuarem reto:

#pesquisar ul li {
 display:inline;
 float: left;
 margin:0px 0px 0px 5px;
}

não utilize overflow-x/y Isso caracteriza a folha como CSS1 e você fica muito limitado quanto a outras regras.

transformando os <li> em flutuantes, a div não fará mais quebras, o que dispensa o uso de overflow-y, tornando-se assim:

 

#pesquisar {
 width:915px;
 height:50px;
 background:red;
 margin:5px 0px 0px 90px;
 overflow: auto;
}

[11closed 0]

ola Evandro Oliveira

 

deixei assim o css

 

#pesquisar {
 width:915px;
 height:50px;
 background:#FF0000;
 margin:5px 0px 0px 90px;
 overflow: auto;
}
#pesquisar ul li { 
 display:inline; 
 float: left; 
 margin:0px 0px 0px 5px;
 
 }

e ainda ñ deu, nd mudou ... ao chegar no final da div os links vão para linha de baixo e continuam la...

 

??? t+

[Evandro Oliveira 331]

adicionar:

 

#pesquisar ul { white-space: nowrap }

 

Ps.: Não testei no IE6

Ps2.: float-left é desnecessário

Ps3.: substitua margin: 0 0 0 5px; por margin-left: 5px;

[11closed 0]

Evandro Oliveira deu certo aq vlw ....