Float image to bottom around text

[Stazzyboo (Staz)]

I want to float (wrap) text around image set to bottom left/right. Here is example of what I am trying to achieve. However if I set div block to flex as per code the float stops working. Any ideas how to achieve this?

Example:

---

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

[Stazzyboo (Staz)]

I figured out a solution on my own. I used code snippet below. Uploaded image to webflow to use as shape for text to wrap. Named the div to swotimage# and applied code, padding and margins for each one. Since I have each in each corner I had to adjust padding and margins for each, and then again for device screen sizes.

The results

The code

<style>
.swotimage1 {
	float:  right;
	shape-outside:  url(https://uploads-ssl.webflow.com/62a0fa4c930bd133d5a9fd99/62c8e99dbf7adc073e11cd39_1S.png);
	shape-margin: 3px;
}

.swotimage2 {
	float:  left;
	shape-outside:  url(https://uploads-ssl.webflow.com/62a0fa4c930bd133d5a9fd99/62c8e6c8903d342636fd85a6_W.png);
	shape-margin: 3px;
}

.swotimage3 {
	float:  right;
	shape-outside:  url(https://uploads-ssl.webflow.com/62a0fa4c930bd133d5a9fd99/62c8e99db362d15a1cf6fab4_3O.png);
	shape-margin: 3px;
}

.swotimage4 {
	float:  left;
	shape-outside:  url(https://uploads-ssl.webflow.com/62a0fa4c930bd133d5a9fd99/62c8e99d38027f580dfc89a1_4T.png);
	shape-margin: 3px;
}

</style>

The adjustments in webflow

What it looked like in webflow before publishing

[Denise_Dambrackas]

Hi! Are “.swotimage…” image elements or is that the name of your paragraph element? I’m just wondering what you’re assigning “shape-outside” to(?). Thanks!

[Stazzyboo (Staz)]

Sorry for being couple years too late, swotimage is horizontal container (inside of the white text box, side to side of the white box that contains individual letters) - see screenshot for ref