Snook publikoval článek s názvem „Překrývající se záhlaví s CSS Grid“, kde se dívá na vzor návrhu záhlaví, který podle mě přesahuje trendy a je navždy populární. Myšlenka je, že záhlaví je nadměrně velké a hlavní oblast obsahu se do ní vplíží a překrývá pozadí záhlaví. Je na tom něco docela příjemného a uklidňujícího.
Moje mysl jde na stejné místo jako Snook:
Historicky jsem to dělal se zápornými okraji. Záhlaví má výšku, která přidává spoustu polstrování na dno a pak tělo dostane
margin-top: -50pxnebo cokoli, co design vyžaduje.
Ale pak se rozhodne místo toho udělat s CSS mřížkou! Zajímavý. Proč? Do toho se dostaneme. Grid se může cítit (a ve skutečnosti být) silnější. Mřížka může být také flexibilnější. Například max-heighta autookraje jsou skvělé při centrování, ale co když chcete nerovný žlab na okrajích? To by tam bylo těžké a s Gridem snadné. Ethan Marcotte napsal:
Spíše než jednoduše nastavit
max-widthjako omezení, mohu použít prázdné místo kolem mého návrhu a považovat ho za nástroj pro rozložení.
Snažím se zpětně analyzovat Snookův nápad v tomto videu a nakonec jej porovnat s mým konečným výsledkem.
- Snook
- Můj (pro estetiku vyčištěný post-video pro smidge)