Streaming live at 10am (PST)

Style unaccessible elements without custom code

When you want to overcharge a Webflow element that is not accessible for styling, instead of adding custom code to override the CSS property, create a DIV on a draft page and give it the exact same class name that the element you’re targeting has. Then add your own styles and test.

For example, it works well when you want a little bit of control on the Lightbox thumbnails. Use the class name w-lightbox-thumbnail on a dummy DIV and add :hover properties.

Back to the page where your Lightbox is, you should notice your styles override Webflows’ default ones.

Your alterations affect all the page site wide and remain active until the dummy hack element is erased and unused styles are cleaned from the style manager tab.