Importante: estou usando Twitter Bootstrap, portanto tudo está com box-sizing: border-box
.
A dificuldade é a seguinte: tenho um elemento com posicionamento absoluto. Eu quero que a largura dele seja igual ao do elemento pai:
div.elemento-filho {
position: absolute;
width: 100%;
}
Isso quase funciona. O meu problema é que o elemento está ficando mais largo do que o pai, porque o width
incluiu as margens (margin
) do elemento pai.
div.elemento-pai {
width: 180px;
margin: 0px 15px;
}
No caso, eu gostaria que a largura do elemento filho não considerasse as margens, ou seja, que ficasse medindo 150px ao invés de 180px.
Eu não posso fixar o width
do elemento-filho, pois ele tem que funcionar para pais de larguras diferentes.
Tem como conseguir isso? De que jeito?
position: absolute
, parece já funcionar. Com oposition: absolute
, fica com muito mais que a diferença das margens. jsfiddle.net/ypdtY