Mix Element with Class Selector in Same CSS Rule

Question

Is it possible to mix element selectors with class selectors? In other words:

<h1 class="header">Hello, World!</h1>

h1 .header {
    color: red;
}

Answer 1

Yes.

Keep in mind that white-space matters in this case.

• h1 .header will target some element with class header that is a descendant of an h1 tag. The descendant combinator (ie. the space) is not a preferred way of handling css descendants if it can be avoided since it can eat up loading resources.
• h1.header targets only h1 elements with the class of header.

Answer 2

Yes. No space between the 2 selectors.

h1.header { /* something; */ }

See https://www.w3schools.com/css/tryit.asp?filename=trycss_syntax_element_class