Στοίχιση στοιχείου μπλοκ με αριστερό περιθώριο στο CSS

Η τιμή auto για το margin στην πραγματικότητα μπορεί όχι μόνο να κεντράρει. Ουσιαστικά αυτή η τιμή επιτρέπει τον αυτόματο υπολογισμό του περιθωρίου και να το κάνει το μέγιστο δυνατό. Όταν βάζουμε auto για το αριστερό και το δεξί περιθώριο - το στοιχείο κεντράρεται.

Μπορείτε, ωστόσο, να βάλετε μόνο το αριστερό περιθώριο. Σε αυτή την περίπτωση το στοιχείο θα λάβει το μέγιστο δυνατό αριστερό περιθώριο και θα πάρει την ακραία δεξιά θέση:

html<div class="parent">
  <div class="child"></div>
</div>

css.parent {
  padding: 10px 0;
  border: 1px solid red;
}
.child {
  margin-left: auto; /* ορίζουμε αυτόματο αριστερό περιθώριο */
  height: 100px;
  width: 200px;
  border: 1px solid green;
}

Результат: