Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Olá nobres desenvolvedores, muito bom dia a todos.
Estou criando um portal de notícias para minha região, e tem um menu drop down (ainda irei criar), e eu queria que esse menu ocupasse a tela inteira (960px somente), venho pedir-lhes ajuda para esse menu.
Um menu com listas que ocupe a tela inteira (960px somente), é possível? Se sim, ajudem-me por favor. Porque tipo, se eu der uma margin-left:; o menu já não fica colado, sacam, quero que fique colado até o fim, inicio e no fim colocado, independente do espaço que os centrais irão ter.
Vejam uma exemplo
Desde já, agradeço.
Olá Pablo, primeiramente agradeço pela resposta, mas ainda não foi resolvido, o que eu preciso é o seguinte:
Um menu que ocupe a tela inteira (960px) em largura, mas que não fique margens do primeiro item da lista e o último item da lista do limite da tela, no exemplo que passei, veja o menu ocupa a tela inteira, e o primeiro item e o último item da lista não fique com margem referente ao limite da tela, tanto left quanto right, não tem espaço, entende?
Wanderson Valerio, se você olhar atentamente vai perceber que sobra um pequeno espaço depois da li de contato, veja imagem: http://d.pr/i/Twb7 o ul#nav está setado com um width:1000px.
Sobre a sua dúvida ou você faz a largura do ul / número de li's e seta esse valor a eles ou cria uma classe pra cada um com um tamanho definido :upset: ou vai equilibrando no padding
:thumbsup:
Tenta assim:
#holder-menu{
width:100%;
height:30px;
background:#CCC;
}
#menu{
width:960px;
height:30px;
margin-left:auto;
margin-rigth:auto;
}no HTML poe dessa forma:
<div id="holder-menu">
<div id="menu">
<ul>
....
</ul>
</div>
</div>vou fazer os teste aqui, obrigado a todos!
Bom dia wanderson
Entendi o que você quer ...
Se procede desta maneira ...
Seu box total do site tem 960px certo ? então vamos lá
o lance do menu não é algo programatico é apenas um bg com repetição você vai fazer o seguinte
no HTML
<!DOCTYPE HTML>
no CSS
body{
No background você vai setar a cor em que termina seu background no meu caso foi #e4e4e4 e na url você vai inserir a
imagem com posicionamento fixado ao topo, e o repeat-x é para repetir o bg.png ou jpg tanto faz na horizontal.
assim você pode usar uma imagem de 1px de largura pelo necessário de px de altura.
no meu portfólio uso esse esquema www.pabloworks.com.br mas minha repetição é um pouquinho abaixo do menu
só você medir no layout a altura do topo para o começo do menu e fazer a repetição do BG...
Espero ter ajudado, se resolver seu problema só assinar o tópico