Preciso colocar uma div
com a propriedade position
= absolute
. Porém, a div
pai tem um padding
e o width: 100%
da div
filho não respeita esse padding
.
Será que a única saída seria definir o width
com o javascript
?
Coloquei um exemplo aqui:
.master {
background-color: red;
width: 200px;
height: 300px;
padding: 10px;
position: relative;
}
.child {
width: 100%;
height: 30px;
background-color: yellow;
position: absolute;
}
<div class="master">
<div class="child">
</div>
</div>
padding
altera o tamanho do elemento, então é esperado que o elemento filho, configurado comwidth: 100%
, fique também com 220px de largura. Tire oposition: absolute
, como o @bfavaretto disse e terá um elemento com 200px.position: absolute
? Usar o div no seu padrão já faz isso. Só tirar as propriedadeswidth
eposition
dali.position: absolute
porque essadiv
amarela vai ficar flutuando por cima do conteúdo restante