Valaha használtál rácsrendszert (rácsrendszer, rács tervezés)? Ha igen, melyik a leginkább tetszik?

Igen, használtam.

Előnyben részesítem a CSS Grid Layout használatát.

Fő okok:

• Natív. Ez egy szabványos CSS specifikáció, amely nem igényel külső könyvtárakat.
• Rugalmasság. Lehetővé teszi összetett kétdimenziós elrendezések (sorok és oszlopok) létrehozását nagy pontossággal és az elemek elhelyezésének ellenőrzésével.
• Reszponzivitás. Könnyen alkalmazkodik különböző képernyőméretekhez, @media lekérdezéseket és olyan egységeket használva, mint az fr.
• Kód tisztaság. A dobozmodellhez képest a Grid gyakran egyszerűsíti a markupot, csökkentve a plusz wrapper elemek szükségességét.

Alapvető használati példa:

/*
  Környező elem grid display-szel.
  Három egyenlő szélességű oszlopot és két automatikus magasságú sort definiálunk.
*/
.container {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: auto auto;
  gap: 20px; /* Térköz az elemek között */
}

/*
  Példa egy elem pozícionálására a rácsban.
  Két oszlopon keresztül nyújtjuk az elemet, a második oszloptól kezdve.
*/
.item {
  grid-column: 2 / span 2;
}

Korábban a Bootstrap Grid System-et is használtam, amely Flexbox-on alapul. Hasznos gyorsan tipikus elrendezéseket létrehozni, de kevésbé rugalmas összetettebb struktúrák esetén, és kötött bizonyos CSS osztályokhoz.

Általánosságban a CSS Grid erősebb és rugalmasabb eszközöket kínál a modern és összetett elrendezések létrehozásához, külső keretrendszerek nélkül.