[quote=gpellizzoni]1. A cor está sendo atribuída. Você não a vê pois a altura da div está 0. Defina uma altura para esse elemento.
CSS por si só não oferece dinamismo, mas você pode gerar um CSS dinâmico através da linguagem que o servidor está interpretando e depois incluí-lo.[/quote]
Não entendi o que você quis dizer com altura. É o atributo height?
As âncoras estão dentro dessa div. Assim, ela não é espandida conforme os seus elementos internos são espandidos?
Dá para você me dar um exemplo para eu entender melhor?
Não entendi por que não estarão dentro da div. Pelo que sei. uma position absolute coloca os elementos em um posição relativa ao primeiro pai, nesse caso, a div.
Não entendi por que não estarão dentro da div. Pelo que sei. uma position absolute coloca os elementos em um posição relativa ao primeiro pai, nesse caso, a div.[/quote]
Tem como você me fazer o favor de me explicar como funciona então as posições absolute e relative?
Pelo que sei: absolute coloca o item em uma posição relativa ao primeiro elemento pai.
relative: item colocado em relação ao fluxo normal de carregamento da página.
position: absolute posiciona o elemento em relação ao primeiro pai que tem posição diferente de static (o padrão)
position: relative permite você ajustar a posição dele em relação a posição normal dele
O problema é que quando se usa position: absolute o elemento passa a não influenciar mais os outros elementos, ele sai do fluxo, por isso sua div pai não crescia
Usando ainda o absolute, para que a cor aparecesse, eu deveria colocar a div como também position absolute?
Se eu coloco qualquer elemento em uma página como position:absolute, eu devo colocar todos (os demais elementos) senão corro o risco de não vê-los na tela?
Se você botar um elemento como position absolute, o pai não vai crescer automaticamente de nenhuma maneira, você teria q setar o height manualmente
Botando como absolute, o elemento passa a se posicionar de acordo com a página em si, há menos que algum pai desse elemento tenha uma posição diferente de static. O que normalmente se faz quando se quer posicionar um elemento em relação à outro é botar position: relative no pai (oq não altera em nada se vc não mexer no top/bottom/left/right) e o filho com absolute
Mas para oq você quer não use absolute, use o código do antitribus
[quote]
Se você botar um elemento como position absolute, o pai não vai crescer automaticamente de nenhuma maneira, você teria q setar o height manualmente
Botando como absolute, o elemento passa a se posicionar de acordo com a página em si, há menos que algum pai desse elemento tenha uma posição diferente de static. O que normalmente se faz quando se quer posicionar um elemento em relação à outro é botar position: relative no pai (oq não altera em nada se vc não mexer no top/bottom/left/right) e o filho com absolute
Mas para oq você quer não use absolute, use o código do antitribus[/quote]
Mas quando eu estou criando uma página com elementos em posições complexas, muitas das vezes eu tenho que usar uma posição em relação ao pai.
Se eu colocar o elemento pai como relative (posição com relação ao fluxo normal) e colocar o filho como absolute, o que muda?
A div1 está 20px da esquerda e topo
A div2 está 20px da esquerda e 40px do topo
Se você colocar o valor de topo da div2 igual ao da div1 verá que a div2 ficará exatamente no lugar da div1
É por isto que a posição é absoluta, e não depende de elemento pai nenhum.
[quote=ECO2004][quote]
Se você botar um elemento como position absolute, o pai não vai crescer automaticamente de nenhuma maneira, você teria q setar o height manualmente
Botando como absolute, o elemento passa a se posicionar de acordo com a página em si, há menos que algum pai desse elemento tenha uma posição diferente de static. O que normalmente se faz quando se quer posicionar um elemento em relação à outro é botar position: relative no pai (oq não altera em nada se vc não mexer no top/bottom/left/right) e o filho com absolute
Mas para oq você quer não use absolute, use o código do antitribus[/quote]
Mas quando eu estou criando uma página com elementos em posições complexas, muitas das vezes eu tenho que usar uma posição em relação ao pai.
Se eu colocar o elemento pai como relative (posição com relação ao fluxo normal) e colocar o filho como absolute, o que muda?[/quote]
A posição absolute depende sim do pai, contanto que exista algum pai com posição sem ser static (por ex: relative)
Experimenta criar um pai com position: relative e botar um filho com position: absolute e top: 0; left: 0. O filho vai estar no canto superior esquerdo do elemento pai e não da página
A posição absolute depende sim do pai, contanto que exista algum pai com posição sem ser static (por ex: relative)
Experimenta criar um pai com position: relative e botar um filho com position: absolute e top: 0; left: 0. O filho vai estar no canto superior esquerdo do elemento pai e não da página[/quote]
Eu coloquei o label Usuário com position:absolute e fiz o mesmo com o input. Pelo que sei e me foi explicado, esses dois elementos saem do fluxo normal da página e o seu posicionamento fica em relação ao seu sucessor que não tenha position:static (nesse caso, é div). Esperava com esse teste que o label e o input se sobrepusessem, mas isso não ocorre. O input está sempre uma linha acima do label. Por quê?
tem uma margin vertical, e essa margin tá fazendo eles não sobreporem
Adiciona isso ao labelusuário que acho q vai fazer oq vc quer, apesar de que pelo que to entendendo da sua tela, não é algo que eu faria
margin: 0; z-index: 10
Pra ver coisas desse tipo e descobrir que o problema era a margem, ideal era vc usar o Chrome ou Firefox com Firebug, que ai era só clicar no element e clicar: Inspect Element