▼
Streaming live at 10am (PST)

Create a heading 1 style from a parent div class

Design help General
#1

Hi there,
I have a heading 1 style globally set for white text. On some pages I want this to be black (blog)

I have a parent div - blog-container. I dont want to make a new class for heading 1.black.
Id like to be able to say any h1 inside the blog-container to be black.

.blog-container h1 {
color: #000
}

How can this be done?

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

#2

Hi @Jeff_Godek,
your css should work.
I tested it in a fidde:
https://jsfiddle.net/2g6yk5nt/

I think you are missing the Semicolon after color: .

.blog-container h1 {
color: #000;
}

Maxi

#3

But how do I apply this with the Selector in Webflow?

#4

You don’t. Webflow does not support normal CSS conventions. What you can do is create a combo class applied to the element or use custom CSS.

#5

Welcome to the community @Jeff_Godek!

If you use the container element to control the text color you can remove any styles from the Heading element itself and instead have it inherit the styles from the parent. Since the default text color is dark already, you’d need to make sure all of your other container elements have white set as their text color, while your blog-container would be set to black.

1 Like
#6

Hi @Jeff_Godek,
Timothy Ricky has a great video about tricky at interactions. He is also talking about dark and light mode (Tutorial how to do) 26:20 sec

Maxi

#7

Yeah thats where Im stuck.

#8

I understand the concept. Just having issues applying that in Webflow. Ill have another look.

#9

If you’re having trouble on a specific project you can include your read-only link and I’ll take a peek