| Autor |
Mensagem |
ghostbastard
Veterano |
# jan/10
· votar
edu ROCK
mas se eu definir absolute ele vai fixar fixo na base, sobre o resto da página?
tipo isso? www.moma.org
|
ghostbastard
Veterano |
# jan/10
· votar
ta, agora usei o fixed e o menu não sumiu, mas a lista ficou amontoada.
|
DarkMakerX
Veterano |
# jan/10
· votar
ghostbastard
depende
se você quer ele como fundo da div, você deve deixar somente assim, :
div#lista {
}
|
ghostbastard
Veterano |
# jan/10
· votar
DarkMakerX
então, vai ser um menu, fixo na base, que não importa como a pessoa role a pagina de cima o menu fica fixoi, aparecendo.
usei o seguinte html:
<div id="navcontainer">
<ul id="navlist">
<li><a href="undefined" title="undefined">item um</a></li>
<li><a href="undefined" title="undefined">item dois</a></li>
<li><a href="undefined" title="undefined">item tres</a></li>
</ul>
</div>
e css:
#navlist
{
margin: 0;
padding: 0 0 20px 10px;
border-bottom: 1px solid #000;
}
#navlist ul, #navlist li
{
margin: 0;
padding: 0;
display: inline;
list-style-type: none;
position: fixed;
bottom: 0
}
#navlist a:link, #navlist a:visited
{
float: left;
line-height: 14px;
font-weight: bold;
margin: 0 10px 4px 10px;
text-decoration: none;
color: #999;
}
#navlist a:link#current, #navlist a:visited#current, #navlist a:hover
{
border-bottom: 4px solid #000;
padding-bottom: 2px;
color: #000;
}
#navlist a:hover { color: #000; }
ta diferente da pagina anterior, eu mudei alguns estilos.
O fixed ta no atributo li , a lista ta fixa, mas ta amontoada, todos os links.
|
edu ROCK
Veterano |
# jan/10
· votar
Você tem que definir essas questões de posicionamento no estilo da div (o que, alías, você nem tinha feito) e não nos itens do menu.
Fiz algumas alterações no seu CSS e ele posicionou o menu no rodapé da página, acho que é mais ou menos o que você quer, tenta aí:
#navcontainer
{position:absolute;
bottom:0;
}
#navlist
{
margin: 0;
padding: 0 0 20px 10px;
border-bottom: 1px solid #000;
display:inline;
}
#navlist ul, #navlist li
{
margin: 0;
padding: 0;
display: inline;
list-style-type: none;
/*position: fixed;*/
}
#navlist a:link, #navlist a:visited
{
float: left;
line-height: 14px;
font-weight: bold;
margin: 0 10px 4px 10px;
text-decoration: none;
color: #999;
}
#navlist a:link#current, #navlist a:visited#current, #navlist a:hover
{
border-bottom: 4px solid #000;
padding-bottom: 2px;
color: #000;
}
#navlist a:hover { color: #000; }
|
ghostbastard
Veterano |
# jan/10 · Editado por: ghostbastard
· votar
edu ROCK
então, a lugar ficou o que eu queria. O problema é que não ta fixo. Quando rolo a página o menu tbm mexe.
se eu coloco fixed no position o menu some.
|
DarkMakerX
Veterano |
# jan/10
· votar
ghostbastard
Tenta coloca a imagem de fundo do navcontainer
Para ficar fixado, acho que tem que ser o div navcontainer também pois ele é o "pai".
Tenta float também.
|
ghostbastard
Veterano |
# jan/10
· votar
DarkMakerX
ta
|
ghostbastard
Veterano |
# jan/10 · Editado por: ghostbastard
· votar
DarkMakerX
coloquei
background: url(../imagens/menu_base.png);
position: fixed
no navcontainer e nada aconteceu, nem a imagem apareceu, nem fixou o menu.
ta foda.
|
DarkMakerX
Veterano |
# jan/10
· votar
ghostbastard
Não sei se ajuda, mas nesse site MoMA essa div tá assim:
#nav {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
z-index: 100;
}
|
ghostbastard
Veterano |
# jan/10 · Editado por: ghostbastard
· votar
DarkMakerX
estranho, eu coloco esse atributos pro navcontainer e nada acontece.
coloquei no #navlist ul, #navlist li e ficou, o problema é que amontoa tudo.
|
ghostbastard
Veterano |
# jan/10 · Editado por: ghostbastard
· votar
ó, amontoado:
http://img51.imageshack.us/img51/5285/errohp.jpg
edit: as imagens estão desalinhadas, eu sei. Mas é facil de resolver, quero resolver os problema smaiores primeiro.
|
DarkMakerX
Veterano |
# jan/10 · Editado por: DarkMakerX
· votar
ghostbastard
Achei o problema da imagem aqui.
Coloca height e width, tipo assim:
#nav {
height: 100;
width: 100;
background-image: url(imagem.jpg);
}
|
DarkMakerX
Veterano |
# jan/10
· votar
O problema do amontoado deve ser aqui no fixed:
#navlist ul, #navlist li
{
margin: 0;
padding: 0;
display: inline;
list-style-type: none;
position: fixed;
bottom: 0
}
|
DarkMakerX
Veterano |
# jan/10 · Editado por: DarkMakerX
· votar
ghostbastard
Aqui tá funcionando.
Joga isso no css:
#navcontainer {
position: fixed;
width: 100%;
background-image: url(m.jpg);
bottom: 0;
left: 0;
}
troca a imagem e tira o fixed que falei em cima
|
ghostbastard
Veterano |
# jan/10 · Editado por: ghostbastard
· votar
hauahhua merda, aqui não deu em nada..
http://img130.imageshack.us/img130/9455/erro2h.jpg
olha, um print do css e de como ta a organização das pastas. Ta certo, mas não aparece.
Será que é o firefox?
edit: não é o firefox, testei no opera tbm e nada.
|
DarkMakerX
Veterano |
# jan/10
· votar
ghostbastard
aqui é firefox e funciona
vai com o firebug em cima do caminho da imagem no css
se a imagem aparecer é porque tá certo
|
ghostbastard
Veterano |
# jan/10
· votar
DarkMakerX
estou usando imagem png, será isso?
|
ghostbastard
Veterano |
# jan/10 · Editado por: ghostbastard
· votar
no firebug o atributo background image nem aparece.
alias, nem o #navcontainer aparece.
Oo
|
DarkMakerX
Veterano |
# jan/10
· votar
ghostbastard
fiz essa página tosca
http://imensuravel.co.cc/teste.html
mas funcionou
|
ghostbastard
Veterano |
# jan/10
· votar
DarkMakerX
huuuahaau, e aqui não funciona. Acho que vou apagar tudo e começar do zero novamente.
|
DarkMakerX
Veterano |
# jan/10
· votar
ghostbastard
ve se tá importando o css certo
|
ghostbastard
Veterano |
# jan/10 · Editado por: ghostbastard
· votar
DarkMakerX
aíi, copiei o mesmo codigo que vc colocou e esta fixo e não amontoado. Deu certo metade =D
A imagem de background não esta funcionando, mas vou tentar renomear os arquivos.
O que estava errado?
|
ghostbastard
Veterano |
# jan/10
· votar
renomeei a imagem que queria colocar na base com o mesmo nome que vc estava usando, só atualizei o caminho e mesmo assim não deu certo.
a imagem é essa, ve se pra vc da certo.
http://img94.imageshack.us/img94/4125/40335572.png
|
DarkMakerX
Veterano |
# jan/10
· votar
ghostbastard
Pelo que eu entendi, o li e ul não podem ser fixed, porque se jogam para esquerda, amontoando. Ainda não entendi muito o porque XD
Mas o fixed tem que ser no elemento maior, que contem todos os outros que você quer que fique estático.
Daí o bottom e left são para ajeitar no canto inferior esquerdo, e como o width tá 100% ele ocupa a parte de baixo inteira.
|
ghostbastard
Veterano |
# jan/10
· votar
DarkMakerX
e vc imagina porque o background não ta funcionando? será a medida da imagem?
|
DarkMakerX
Veterano |
# jan/10
· votar
DarkMakerX
Achei!
Coloca isso embaixo do background-image:
background-position: bottom left;
o/
|
DarkMakerX
Veterano |
# jan/10
· votar
Obrigado Google!
|
ghostbastard
Veterano |
# jan/10
· votar
DarkMakerX
hauahua
desculpa fazer vc procurar, mas é que venho procurando desde ontem, fiquei ate as 4 fazendo isso, mas como sou noob não conseguia resolver.
|
DarkMakerX
Veterano |
# jan/10
· votar
ghostbastard
Que isso
Aprendo junto pesquisando
Sou nerd. Não resisto.
|