These last days I faced a simple problem with a friend about position: absolute
. If you have a relative
parent with padding
and a child element with position: absolute
, and you want that the child element fills 100% of the parent width; it is better if instead of padding
you use margin
so the margin space could be calculated outside of the box. Basically, if you use padding, this space is applied to the parent element, so your child 100% width would be bigger than it should be.
<div class="parent">
<div class="child"></div>
</div>
.parent {
position: relative;
padding: 10px;
/* margin: 10px; */
width: 100px;
height: 100px;
}
.child {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
"Life is simple. Are you happy? Yes? Keep going. No? Change something."
- 📖 Predictably Irrational: The Hidden Forces That Shape Our Decisions | 🏃 14%
- 🎧 Gravity - Cat Dealers, Evokins, Magga