Aligning a Block Element with Left Indent in CSS
The value auto for margin can actually do more than just center. In fact, this value allows us to calculate the margin automatically and make it as large as possible. When we set auto for left and right margins, the element is centered.
However, you can only set a left indent. In this case, the element will receive the maximum possible left indent and will occupy the far right position:
<div class="parent">
<div class="child"></div>
</div>
.parent {
padding: 10px 0;
border: 1px solid red;
}
.child {
margin-left: auto; /* set automatic left indent */
height: 100px;
width: 200px;
border: 1px solid green;
}
:
