Streaming live at 10am (PST)

Rotating Background Image Within Div

Hi Is there any way to rotate the background image within a div directly in Webflow’s designer?

The reason being I am looking to have a diamond with rounded corners as an image mask. I have added rounded corners to the div, rotated it 45 degrees and added a background image, this also rotates the background image which I don’t want. I want the image to be 0 degrees.

Any help will be appreciated.

Scott


Here is my site Read-Only: https://preview.webflow.com/preview/emtec-hero?utm_medium=preview_link&utm_source=dashboard&utm_content=emtec-hero&preview=9041853c5a485342a01ed900c46f5183&mode=preview

1 Like

Hi @scottalexwatson You cannot rotate background image, but you can add a new image inside the div block with position: absolute.

Make sure your div block is position: relative:

and rotate this image too (-45):

And then you can adjust size and margins to fit the image on this div block.

I don’t know if is not better to use just an image manipulated on photoshop, because if you add some content inside this block will be rotated too.

I hope it helps you :wink:

Cheers,
Eve Kayser

Hi Eve,

This works perfect. Thanks so much!

1 Like