Home>Support>A Custom CSS Page Builder Widget Attributes not working

A Custom CSS Page Builder Widget Attributes not working

I have used the A Custom CSS Page Builder Row Attributes to make changes to a row, but when I try them on a widget, nothing happens. I have read through A Custom CSS Guide to Page Builder Row, Cell & Widget Attributes https://siteorigin.com/custom-css-guide-page-builder-row-cell-widget-attributes/.
Here is an example page https://spr.com/test-css-attribute-issue/. Notice that in the blue section the below text in the three columns should be white, but they are in a separate widget that does not allow for rich text / html formatting. When I add a Widget ID, Widget Class, and CSS Declarations to that widget, nothing happens. I don’t even see the ID or class when I inspect the html.
If you look below the blue section there are two white rows. One has no CSS Declarations in the row, and the other has a CSS Declaration giving it a margin.
Why is this why are the attribute fields working for rows but not widgets?

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 1 day, 12 hours ago Andrew Misplon
    Hi, I Work Here

    Hi, thanks for posting your question.

    Your widget markup is non-standard. You can try comparing your test page to https://demo.siteorigin.com/corp/sandbox/. Specifically, the markup within the panel-grid-cell div of your test page vs the page linked above. I’m not sure where the custom behavior is originating from, your theme or a plugin.

    You could target your row class name plus .spr-icon-supported-text. As an example:

    .test-css-attribute-issue .spr-icon-supported-text { color: white; }
Please log in to post on our forums. Signing up is free.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More