Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
To com um probleminha aqui..
tenho essa estrutura de menu
<ul>
<li class="parent"><a href=""></a>
<ul>
<li class="children"><a href=""></a></li>
<li class="children"><a href=""></a></li>
</ul>
</li>
<li class="parent"><a href=""></a></li>
<li class="parent"><a href=""></a></li>
</ul>com esse estilo aqui..
li.parent a { width:80px; text-align:center; background:#F00; color:#000; text-decoration:none;}
li.children a { padding:3px 10px; color:#090;}
O que acontece é que, os elementos filho da lista, herdam a largura que eu coloquei pros pais.. e eu não queria, queria que eles continuassem sem largura definida,... alguém sabe como fazer isso? Fui claro na minha dúvida?
Mas o elemento maior é o pai, e não o filho, eu quero que o filho fique sem largura nenhuma..
Com esse print aqui acho que fica mais fácil entender..
/applications/core/interface/imageproxy/imageproxy.php?img=http://kingbebidas.com.br/images/print-2012-08-1_11.03.33.png&key=2cbb9394894d7e7f4a8b7df5a53f2b8706950fbc4602e701b0844eabb636957b" alt="print-2012-08-1_11.03.33.png" />
Nesse caso, o pai tem 391px de largura, e o filho eu deixei com width:80px, pq se deixasse sem largura, ele herdaria a do pai, e ficaria gigante, certo?
Mas eu não quero que ele tenha uma largura certa, e sim, deixa-lo sem largura, e não herdar a largura do pai.
Mas ele não herda. O que acontece é que ele vai ocupar 100% da largura do pai.
veja sobre display: inline-block; e width: auto;
Agora eu coloquei o width: auto; e funcionou, pq resetou a largura do filho, e não herdou o valor do pai.
eles não "herdam", mas eles são limitados pela largura do pai.
não faz sentido um elemento maior dentro de um menor.