What does this mean?

martaramos · September 12, 2019, 5:12pm

What does it do? In what situation would I use this?

header#main-header h1 { … }

Aveolar · September 12, 2019, 5:15pm

It is being use for styling the header tag, id and the h1 tag in CSS

martaramos · September 12, 2019, 5:43pm

Why not just use: header, #main-header, h1 { ... } ?

Cowwy · September 12, 2019, 6:25pm

Contextual CSS styling

It means the h1 tag within header tag with the id “main-header” will get the styling.

It is different from header, #main-header, h1 because this is three different tags that will get the same styling. Whereas the above only 1 tag gets styled.

Steffan153 · September 12, 2019, 6:11pm

That means something totally different. It means apply ... (your style rules) to header, #main-header, and h1.

But header#main-header h1 means any h1 inside a header element with the ID of main-header (header#main-header => it applies only to elements that are a header AND a #main-header).