Read more

CSS: Letting text flow around a round element

Dominik Schöler
January 10, 2024Software engineer at makandra GmbH

If you have an element with significant border-radius (e.g. 50% for a circle) and you want inline content (i.e. text) to flow around it, do it like this:

  --margin: 10px;
  shape-outside: content-box;
  margin-left: var(--margin);
  margin-bottom: var(--margin);
  shape-margin: var(--margin);
Illustration online protection

Rails professionals since 2007

Our laser focus on a single technology has made us a leader in this space. Need help?

  • We build a solid first version of your product
  • We train your development team
  • We rescue your project in trouble
Read more Show archive.org snapshot

Image

Posted by Dominik Schöler to makandra dev (2024-01-10 13:21)