Quantcast
Channel: Active questions tagged flexbox - Stack Overflow
Viewing all articles
Browse latest Browse all 1450

How to wrap text completely around a png object using CSS without canvas [duplicate]

$
0
0

I need to wrap text around an object (from a png image) using CSS. The text should be wrapped just like how it is arranged in the attached image, not in a box or a defined shape. I have achieved the same result using python and html canvas, but I am required to do it without canvas (just paragraph tags, spans and divs).Please note that I have very little experience in front end development and CSSI found a few solutions that attempt to solve this but none of them could do it completely.

The desired output:

I have solved the problem in python, because that is what I know (I work in AI). I had used pillow library because I need custom fonts in other languages.The attached image is output of the same program.

I could achieve the same result using Html canvas, but it is not permitted to be used in the problem statement.

I need a flexible solution where the image can be positioned anywhere within the text, not just as a left or right column using shape-outside and floats. The text should maintain its alignment regardless of image placement.

In this solution the desired output is received because the shape is a circle, and this developer has used its radius and position to arrange the text. But in my case, the object will be a real png with random shape.


Viewing all articles
Browse latest Browse all 1450

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>