CSS Grid

2-boyutlu ızgara sistemi ile karmaşık düzenler.

Grid, satır ve sütun tanımlayarak iki boyutlu düzenler oluşturur. Temel özellikler:

display: grid;
grid-template-columns / grid-template-rows
gap – Hücre arası boşluk.

Grid Örneği

.grid-container {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 3 eşit sütun */
    gap: 10px;
    background: #fafafa;
    padding: 10px;
}
.grid-item {
    background: #2196f3;
    color: white;
    padding: 20px;
    text-align: center;
}