Få teksten til å flyte rundt bildene dine

Med clip-path og shape-outside i CSS får du full kontroll.

📽️: MIKAEL BREVIK Vis mer

Å få bilder og tekst til å fungere sammen kan vel sies å være mye av målet med CSS. Og det er enklere sagt enn gjort.

Men lærer du deg clip-path og shape-outside er mye gjort!

I denne ukas Kodesnutt viser Mikael Brevik deg hvordan du får teksten til å flyte perfekt rundt bildene dine – uansett om de er firkanter, sirkler eller kompliserte polygoner.

Den korte kodesnutten ser du øverst i artikkelen!

I videoen får du også se det imponerende nye utviklerverktøyet i Firefox, som lar deg redigere polygoner rett i nettleseren, og kopiere resultatene inn i koden din. Med det kan du tegne perfekte baner rundt grafikken din, og se hvordan teksten tilpasser seg i sanntid.

Og ikke nok med det – denne Codepen-en fra Mikael viser deg hvordan clip-path og shape-outside fungerer i praksis: