Układ trójkolumnowy oznacza, że trzy elementy blokowe mają znaleźć się w jednym wierszu, obok siebie. Klasycznym (historycznie bardzo popularnym) sposobem osiągnięcia tego w CSS jest użycie właściwości float oraz nadanie elementom odpowiedniej szerokości.
Odpowiedź ".kolumny { float: left; width: 33%; }" realizuje tę ideę wprost:
- float: left wyjmuje element z normalnego przepływu w taki sposób, że kolejne elementy mogą ustawiać się obok niego (po prawej stronie), o ile jest na to miejsce.
- width: 33% ustala, że każda kolumna zajmuje około jednej trzeciej szerokości kontenera, co przy trzech elementach pozwala im zmieścić się obok siebie.
Dlaczego pozostałe typowe odpowiedzi w takich zadaniach bywają błędne? Najczęściej dotyczą właściwości, które:
- nie powodują ustawienia elementów w jednym wierszu (np. same marginesy, wyrównanie tekstu czy wysokość),
- zmieniają wygląd, ale nie mechanizm układu (np. kolor tła, obramowanie),
- nie gwarantują trzech kolumn obok siebie (np. brak określonej szerokości może spowodować zawijanie do kolejnej linii).
Warto pamiętać, że choć float jest rozwiązaniem działającym i spotykanym w starszych szablonach, we współczesnych projektach częściej stosuje się nowsze mechanizmy układu (np. siatkę lub układy elastyczne), bo są bardziej przewidywalne i wygodne. Na egzaminie jednak nadal można spotkać pytania sprawdzające rozumienie klasycznych technik oraz umiejętność pracy z kodem legacy.