NO BUG: Custom CSS Classes Not Working on Frontend

Bugs
1

Custom CSS classes added to elements in the editor are not being applied on the frontend. The classes work correctly inside the Bricks editor preview but disappear or do not take effect when the page is viewed live.

Steps to Reproduce:

  1. Open a page with BricksBuilder (v2.0.1).
  2. Add a custom CSS class to an element (e.g., .gk-dropdown-content).
  3. Apply styling to this class through Bricks or custom CSS.
  4. Save and view the page on the frontend.

Expected Result:
The custom CSS class (e.g., .gk-dropdown-content) should be visible in the frontend HTML and its styles should apply consistently, just like in the editor.

sc1
sc11920×942 79.4 KB

sc2
sc21920×909 163 KB

Actual Result:

  • The class appears in the editor and styles apply correctly.
  • On the frontend, the class is missing or ignored in the rendered output (see attached screenshots).
    • Screenshot 1 (Editor): The custom class .gk-dropdown-content is visible and styles apply.
    • Screenshot 2 (Frontend Inspector): The class exists in the markup but styles do not apply as expected.

Additional Notes:

  1. This is a fresh install of v2.0.1.
  2. All plugins except WooCommerce were deactivated.
  3. Tried disabling Bricks cascade layer, but the problem persisted.
  4. Clearing cache and regenerating CSS files does not resolve the issue.
  5. Tested in multiple browsers with the same result.
2

Hi Grey,
Welcome to the forum, and thanks so much for your report!

Unfortunately, I cannot reproduce the problem. Please check your class list and see if there’s a class that consists of a dot like this: . If so, delete it.

Best regards,
timmse

3

Hi timmse,

You are right — there was indeed a class consisting of just a dot. After deleting it, everything is now working correctly.

Thanks a lot for pointing that out!

1 Like
4

I have a similiar problem. My classes doesnt work at frontend:

image
image1704×1219 302 KB

Fronted class doesn’t have content:

image
image1097×579 77.4 KB

Did you encountered this? BricksVersion: 2.3.2

@timmse any ideas? It only works when ID is styled, not a class. I tried disabling all plugins etc. No change.

5

Found it - numbers in classes made class non working at frontend. Please, take a look at this guys. @timmse

6

In CSS, a class name cannot start with a number.

2 Likes
7

Yep, that’s right :+1: