Comments on A Redesign with CSS Shapes

13 Reader Comments

Back to the Article
  1. I’m not seeing the effect on Safari (macOS 10.12 Sierra), though it should be supported. Not using prefixes?

    Copy & paste the code below to embed this comment.
  2. Same for older versions of Safari. Brad’s right, need some prefixes.

    Copy & paste the code below to embed this comment.
  3. Question regarding this line of code

    shape-outside: circle(150px at 170px 130px);

    Is the (at) being used to center the circle?

    Thanks!

    Copy & paste the code below to embed this comment.
  4. On my windows 10 PC, on firefox and edge it’s not working. On Opera and Chrome it is.

    Copy & paste the code below to embed this comment.
  5. Didn’t know you could do this with CSS only. Thanks for sharing!

    Copy & paste the code below to embed this comment.
  6. All that and you forget retina support!?!

    Copy & paste the code below to embed this comment.
  7. yes ivan wong is correct and thanks for this post.

    Copy & paste the code below to embed this comment.
  8. Thanks for sharing this, creating styling bubbles with just css!! its awesome, a worthy content to share with friends.
    Web development company in Trivandrum Kerala India

    Copy & paste the code below to embed this comment.
  9. Awesome case study. Cant wait until it’s supported widely.

    Copy & paste the code below to embed this comment.
  10. Thanks Eric for this article - but I have been doing the portholes or the bubbles using a border-radius and i used to give it 50% - i get rounded images using that approach - is that any different from the shape-outside outcome? does it have any drawbacks?

    Copy & paste the code below to embed this comment.