Flexbox

Esnek kutu modeli, yön ve hizalama kontrolü.

Flexbox, bir kapsayıcı içindeki öğeleri tek eksende (satır ya da sütun) dağıtmak için güçlü bir araçtır.

display: flex; – Flex konteyneri tanımlar.
justify-content – Ana eksende hizalama.
align-items – Çapraz eksende hizalama.

Flexbox Örneği

.container {
    display: flex;
    justify-content: space-between; /* öğeleri arasına boşluk */
    align-items: center;            /* dikey ortalama */
    background: #e0e0e0;
    padding: 10px;
}
.item {
    background: #4caf50;
    color: white;
    padding: 15px;
    margin: 5px;
}