Como você faz um elemento posicionado absoluto honrar o preenchimento de seu pai? Eu quero que uma div interna se estenda pela largura do pai e seja posicionada na parte inferior desse pai, basicamente um rodapé. Mas a criança tem que honrar o estofamento dos pais e não está fazendo isso. A criança é pressionada contra a borda dos pais.
Então, eu quero isso:
mas estou entendendo isso:
<html>
<body>
<div style="background-color: blue; padding: 10px; position: relative; height: 100px;">
<div style="background-color: gray; position: absolute; left: 0px; right: 0px; bottom: 0px;">css sux</div>
</div>
</body>
</html>
Posso fazer isso acontecer com uma margem em torno da div interna, mas prefiro não ter que adicionar isso.
left:
e right:
sobre a criança (absoluto posicionada), o problema está resolvido. Estou adicionando este b / c que é a resposta que outras pessoas com o mesmo problema provavelmente estão procurando.
style="background-color: gray; position: absolute; left: 10px; right: 10px; bottom: 10px;"
?