Olá amigos, estou tendo dificuldade com um projeto muito simples, o que está me deixando louco, uma vez que é algo tão básico.
Estou trabalhando em um menu em css , e todos os seletores seguem funcionando normalmente, conforme especificação da w3c, contudo quando chega o momento de selecionar uma UL filha (o submenu) ele não reconhece, só vai se for por id ou class.
como podem observar não há nada demais, apenas um lista para formação do menu. até a ok.
na folha de estilos, segui dando as configurações iniciais...
primeiramente retirei as margens e espaço interno, bem como o estilo de lista:
ul{list-style:none; padding:0; margin:0; }
Em seguida defini o estilo das li para se parecerem mais com botões:
então quando eu tento acessar as ul que estão inclusas em alguma li, não consigo pelo seletor >.
li>ul{
position:absolute;
left:180px;
}
este seletor deveria selecionar todas as ul que tivessem como pai uma li, entretanto simplesmente não esta sendo reconhecido aqui. e não é aplicado nenhum efeito
o mais terrível é que esta mesma ação esta sendo efetuada neste vídeo e funciona normalmente, ¬¬.
http://youtu.be/sw85W4cggTs?t=10m25s
é isto meus amigos!
segue o código completo.
Index
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="pt" xml:lang="pt">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="css/site.css" media="screen" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
</head>
<body>
<div id="geral">
<div id="top">
<img src="img/logo.png" alt="Logo Villar Copacabana" />
</div>
<div id="esquerda">
<ul id="menu">
<li>Home</li>
<li>Configurações</li>
<li>Cadastrar Usuário</li>
<li>Unidades</li>
<li>Gerar Cobrança</li>
<li>Impressão Mensal</li>
<li>Balancete</li>
<li>Informar Ídices</li>
<li>Descontos e Acréscimos</li>
<li>Informar Pagamento</li>
<li >Proposta de Locação</li>
<ul >
<li >Nova Proposta</li>
<ul >
<li>Automática</li>
<li>Manual</li>
</ul>
<li>Propostas em Análise</li>
</ul>
<li>Gerar Contrato</li>
<li>Inquilinos</li>
<li>Jurídico</li>
<li>Contato</li>
</ul>
</div>
<div id="conteudo">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris fringilla porttitor lobortis. Nulla ut dolor ante, quis viverra lorem. Sed eu enim dui. Vestibulum orci diam, convallis nec lobortis id, porttitor eu ipsum. Phasellus porttitor, nisi sed semper posuere, risus tellus egestas nibh, in ornare turpis elit vel tortor. Morbi porta lorem vel urna tempus vulputate. Proin tortor urna, semper eu commodo nec, molestie at risus.</P>
<p>Cras in felis leo, id rhoncus massa. Curabitur vel sem eget neque consequat gravida. Fusce quis dolor felis, id consectetur ipsum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Donec sed sollicitudin turpis. Ut molestie lectus at ante consequat sollicitudin. Sed porttitor, magna a tincidunt ultrices, justo magna pulvinar nisi, eget fermentum justo urna quis quam. Phasellus cursus bibendum varius. Mauris eget leo risus, in porttitor lorem. Phasellus hendrerit pharetra lorem vel bibendum. Phasellus diam eros, blandit ut pellentesque non, vulputate eu diam.</p>
<p>Nunc at suscipit velit. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Vivamus ultrices massa ac nulla lacinia pellentesque. Integer placerat mollis libero. Donec leo augue, aliquam non condimentum non, molestie ac ligula. Nunc quis suscipit ligula. Quisque eleifend turpis at metus vehicula quis laoreet tortor sagittis. Sed bibendum mauris quis augue accumsan vel aliquet enim posuere. Suspendisse semper placerat dictum. In sagittis rutrum sem, sit amet rhoncus nibh dictum sed. Proin mauris neque, lobortis at convallis ut, malesuada vitae odio. Nulla neque eros, fermentum nec eleifend sit amet, egestas at turpis.</p>
<p>Suspendisse non risus sed quam dapibus tincidunt. Aliquam sagittis tincidunt interdum. Suspendisse sed nisi a arcu luctus consequat ut nec risus. Phasellus ullamcorper porttitor dapibus. Sed semper purus at nulla molestie nec interdum sem lacinia. Nulla non rhoncus orci. Sed vitae ullamcorper elit. Sed consectetur odio in sapien facilisis tristique. Nullam varius tempor neque, eu faucibus lacus hendrerit ac. Nulla facilisi. Maecenas nec magna sed magna laoreet lobortis et a dolor. Pellentesque a ante tortor. Aenean fermentum interdum neque, nec euismod mi ornare at. Etiam pretium, ipsum at feugiat venenatis, nunc purus ultrices arcu, quis suscipit felis massa gravida purus.</p>
<p>Fusce nec leo erat. Etiam mi odio, elementum laoreet ornare eget, commodo tincidunt nisi. Vivamus pharetra bibendum lorem non elementum. Sed id nibh justo. Phasellus non interdum nulla. Suspendisse tortor sapien, lobortis vitae feugiat id, accumsan vel est. Sed accumsan, tortor sed venenatis vestibulum, arcu turpis placerat tellus, id sollicitudin risus orci id dui. Aliquam suscipit diam massa, a bibendum turpis.</P>
</div>
<div id="rodape">
Sistema Administrativo
</div>
</div>
</body>
Pergunta
Jackson Barreto
Olá amigos, estou tendo dificuldade com um projeto muito simples, o que está me deixando louco, uma vez que é algo tão básico.
Estou trabalhando em um menu em css , e todos os seletores seguem funcionando normalmente, conforme especificação da w3c, contudo quando chega o momento de selecionar uma UL filha (o submenu) ele não reconhece, só vai se for por id ou class.
segue o código.
Index.html
como podem observar não há nada demais, apenas um lista para formação do menu. até a ok. na folha de estilos, segui dando as configurações iniciais... primeiramente retirei as margens e espaço interno, bem como o estilo de lista:ul{list-style:none; padding:0; margin:0; }Em seguida defini o estilo das li para se parecerem mais com botões:li{ width:160px; border: 1px solid #0040FF; padding:5px; border-radius:10px; margin:3px; background-color: #0080FF; color: #ffffff; font-weight:bold; text-shadow: 2px 2px 15px #000000; }Então segui para fazer o rollover,li:hover{background-color: #0000FF; color: #ffffff; font-weight:bold; text-shadow: 2px 2px 15px #000000;}então quando eu tento acessar as ul que estão inclusas em alguma li, não consigo pelo seletor >.li>ul{ position:absolute; left:180px; }este seletor deveria selecionar todas as ul que tivessem como pai uma li, entretanto simplesmente não esta sendo reconhecido aqui. e não é aplicado nenhum efeito o mais terrível é que esta mesma ação esta sendo efetuada neste vídeo e funciona normalmente, ¬¬. http://youtu.be/sw85W4cggTs?t=10m25s é isto meus amigos! segue o código completo. Index Cssbody{ background: url('../img/fundo_login.jpg'); } div { } ul{list-style:none; padding:0; margin:0; } li{ width:160px; border: 1px solid #0040FF; padding:5px; border-radius:10px; margin:3px; background-color: #0080FF; color: #ffffff; font-weight:bold; text-shadow: 2px 2px 15px #000000; } li:hover{background-color: #0000FF; color: #ffffff; font-weight:bold; text-shadow: 2px 2px 15px #000000;} #menu{position:absolute;} li>ul{ position:absolute; left:180px; } #geral{ margin: 0 auto; width: 1000px; } #top{ text-align: center; } #esquerda{ float:left; width: 180px; } #conteudo{ float:right; width:800px; } #rodape{ clear:both; text-align: center; }Link para o comentário
Compartilhar em outros sites
3 respostass a esta questão
Posts Recomendados
Participe da discussão
Você pode postar agora e se registrar depois. Se você já tem uma conta, acesse agora para postar com sua conta.