Én av de mest brukte memene innen programmering, i alle fall webutvikling, er dette med å sentrere en div vertikalt.
Det har alltid fantes en rekke måter å gjøre det på, men det vanligste er det også ChatGPT foreslår når vi spør hvordan vi enklest mulig løser dette problemet:
Bruke flexbox, eller grid. Som ofte ender opp med massevis av meningsløse div-er som containere.
Men visste du at du nå kan sentrere en div med én linje CSS, helt uten hverken flexbox eller grid?
align-content: center
Vi ble klar over nyheten gjennom blogginnlegget til James Smith, på build-your-own.org, som i skrivende tidspunkt troner aller høyest på r/programming på Reddit.
«align-content virker i standard-layouten i 2024, og lar deg vertikalt sentrere med én CSS-egenskap» skriver han, og går gjennom hvorfor dette er store og gode nyheter for mange.
Og jommen har han ikke helt rett; du kan nå sentrere en div ved å ganske enkelt få med dette i CSS-en:
align-content: center;
Støttes av 82 prosent
CSS-endringen har ifølge caniuse.com vært støtta siden blant annet:
- Chrome 123
- Firefox 125
- Safari 17.4
- Opera 109
Som vanlig er du altså ikke sikra at alle brukerne dine får glede av dette, men ifølge samme kilde har næmere 82 prosent av verdens nettbrukere en nettleser som støtter dette.
– Topp. Jeg kan knapt vente til 2034 når jeg kan begynne å bruke dette på nettsidene mine uten å være bekymra for kompabilitet, skriver en bruker syrlig på Reddit.
Men dette er i alle fall godt nok for mine hobbyprosjekter.