# Полезные трюки CSS #1

By [tomkoom](https://paragraph.com/@tomkoom) · 2021-12-30

---

1\. Если применить `margin-left: auto` к **последнему флекс-айтему** внутри контейнера он выровняется по правой стороне при том что остальные останутся слева.

`|||---` → `||---|`

* * *

2\. Центрирование внутри экрана с помощью `position: fixed`

    .popup {
        position: fixed;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
    }
    

* * *

3\. Центрирование внутри экрана с помощью `grid`

    body, html {
        height: 100%;
        display: grid;
    }
    .i-am-centered {
        margin: auto;
    }
    

* * *

4\. Центрирование элементов внутри контейнера:

    .wrapper {
      display: grid;
      place-items: center;
    }

---

*Originally published on [tomkoom](https://paragraph.com/@tomkoom/css-1)*