Olá Pessoal,
gostaria de pedir ajuda para quem entende um pouco melhor de CSS.
Eu preciso pegar o segundo nível do menu e diminuir o tamanho dele, com
tamanho suficiente para mostrar o número e, além disso, preciso fazer os
números abrirem lado-a-lado, não um embaixo do outro como está acontecendo.
Já tentei várias coisas, mas sempre que arrumo uma, estrago outra.
Bom a idéia é que o menu aberto fique algo mais ou menos assim:
1 2 3 4 Nome da empresa
<style>
ul#primary-nav, ul#primary-nav ul {
margin: 0;
padding: 0;
width: 150px; /* Width of Menu Items */
border-bottom: 1px solid #ccc;
background: #fff; /* IE6 Bug */
font-size: 100%;
font:normal 10px verdana, arial, helvetica;
}
ul#primary-nav li {
position: relative;
list-style: none;
}
ul#primary-nav li a {
display: block;
text-decoration: none;
color: #777;
padding: 3px;
border: 1px solid #fff;
border-bottom: 0;
}
/* Fix IE. Hide from IE Mac \*/
* html ul#primary-nav li { float: right; height: 1%; }
* html ul#primary-nav li a { height: 1%; }
/* End */
ul#primary-nav ul {
position: absolute;
display: none;
right: 149px; /* Set 1px less than menu width */
top: 0px;
padding: 0px;
background-color:#ccc;
}
ul#primary-nav li ul li a {
padding: 2px 5px; /* Sub Menu Styles */
}
ul#primary-nav li:hover ul ul, ul#primary-nav li:hover ul ul ul,
ul#primary-nav li.over ul ul, ul#primary-nav li.over ul ul ul {
display: none; /* Hide sub-menus initially */
}
ul#primary-nav li:hover ul, ul#primary-nav li li:hover ul, ul#primary-nav li
li li:hover ul,
ul#primary-nav li.over ul, ul#primary-nav li li.over ul, ul#primary-nav li
li li.over ul {
display: block; /* The magic */
}
ul#primary-nav li.menuparent {
/* background: transparent url(arrow.gif) right center no-repeat; */
background: #ccc;
}
ul#primary-nav li.menuparent:hover, ul#primary-nav li.over {
background-color: #f9f9f9;
}
ul#primary-nav li a:hover {
color: #E2144A;
}
</style>
<ul id="primary-nav">
<li class="menuparent"><a href="#">Empresa1</a>
<ul><li class="menuparent" onmouseover="loadImg(1)"><a href="#">1</a></li>
<li class="menuparent" onmouseover="loadImg(2)"><a href="#">2</a></li>
<li class="menuparent" onmouseover="loadImg(3)"><a href="#">3</a></li>
<li class="menuparent" onmouseover="loadImg(4)"><a href="#">4</a></li>
</ul>
</li><li class="menuparent"><a href="#">Empresa2</a>
<ul><li class="menuparent" onmouseover="loadImg(5)"><a href="#">1</a></li>
<li class="menuparent" onmouseover="loadImg(6)"><a href="#">2</a></li>
<li class="menuparent" onmouseover="loadImg(7)"><a href="#">3</a></li>
</ul>
</li>
</ul>
Muito obrigado.
Abraço,
Tiago
_______________________________________________
Lista mailing list
[email protected]
http://codeigniter.com.br/mailman/listinfo/lista_codeigniter.com.br
