β–Ό
Streaming live at 10am (PST)

Custom css in html embed


#1

Hi. I want to embed a image from external URL and i want it to be a bakcground image. So i need to use CSS. Is it possible to write in CSS in a Html embed code in webflow? I want to make the image attribute a background image that covers a specific size.

Anybody? :slight_smile:


Inline-block vertical align
#2

Hey @Stig_Ark

It’s possible to write css in a html embed code in webflow, just wrap your code into tags, like so :

<style>
.yourclass { 
  background: url(your-image-url) no-repeat center center fixed; 
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
} 
</style>

#3

@Blaise_Posmyouck

Thank you for a quick reply. I am getting an image from a url thats in a CMS. So i use the picture slug inside the hmtl embed. But i can not get the cover to work. This is my last try(picture below) but it will not work either.

Do you have another suggestion/code?


#4

I also tried this, but when the picture is bigger then 200 px wide, it does not become a circel. And it gets stretched when i use 200px witdh too. Any suggestion anyone?


#5

Try putting the style tags in the parent page settings (I can elaborate on this if you need more help)