Question

For the longest time I was styling my elements in this way.

table .class tr, th{

} 

Today I had some insane css related bugs and it occurred to me that it may have worked in the past by accident and in fact what it is doing is not selecting tables of a certain class but selecting tables followed by elements of a certain class.

I kind of assumed that css would just ignore the space between table and .class. But does it?

table.class tr, th{

} 

Would this work differently? I can’t believe I didn’t think about this before! (embarrassed)

Thanks!

Answer 1

table .class tr selects this:

<table>
    <tbody class="class">
        <tr></tr>
    </tbody>
</table>

While table.class tr selects this:

<table class="class">
    <tr></tr>
</table>