Zadanie rekrutacyjne do firmy. Wymagają nieużywania żadnych frameworków, gridów. Użylibyście do tego flexa czy czego? Cała strona opiera się na 3 i 4 kolumnach naprzemiennie.
Co prawda odpowiedziałam ci już w innym temacie, ale powtórzę tu i trochę uszczegółowię.
Po co ci tu w ogóle grid? ;) Rozbierz ten layout do bebechów. Nie ma tu nic skomplikowanego, wystarczy zwykły html i css!
<header>
<nav class="nav-left"></nav>
<div class="logo"><div>
<nav class="nav-right"></nav>
</header>
<section>
<h1></h1>
<a class="button"></a>
</section>
<section>
<div class="col"></div>
<div class="col"></div>
<div class="col"></div>
</section>
<section>
<form>
<div class="col">
<input type="text" />
<input type="text" />
<input type="text" />
</div>
<div class="col">
<textarea></textarea>
</div>
<button></button>
</form>
</section>
<section>
<a href="#" class="back-to-top"></a>
</section>
<footer>
<div class="footer-left">
<div class="col"></div>
<div class="col"></div>
</div>
<div class="footer-center"></div>
<div class="footer-right"></div>
</footer>
No i w sumie tyle filozofii... Nie napiszę ci do tego styli, bo miałbyś już wszystko gotowe :P Podpowiem jedynie, że klasa col powinna mieć float: left i narzuconą szerokość (może być w procentach). Dla różnych rozdzielczości możesz zdefiniować różne szerokości, żeby np. na mobilkach col miało zawsze 100%.
takie zadania rekrutacyjne i tak są bez sensu, co z tego że powiedzmy 50 osób wykona** identycznie** taką stronkę? zatrudnią i tak tych z innymi plusami, jeszcze rozumiem jakieś zadanie na własną inwencję gdzie można się pokazać indywidualnie, ale to z kolei większa strata czasu...
Do tej pory robiłem to tak że miałem klasę w której kolumny miałem width w % do siatki 3 i 4 kolumnowej osobno. Np 3-col-1of3 albo 4-col-1of4. Do każdej kolumny miałem dodane marginy, bo na screenie widać że są tam marginy na około 20px i wtedy wrzucałem sobie treść w te kolumny i stylowalem używając align left albo right. Tylko nie za bardzo miałem pomysł jak wstawić header text żeby mi wycentrowalo do kontenera a nie pojedynczej kolumny