background image

Astonishing that no answer addresses or mentions the actual problem here.

The CSS selector button #rock says “give me an element with the id rock inside a <button> element”, like this:

<button>
    <span id="rock">This element is going to be affected.</span>
</button>

But what you wanted is a <button> element with the id rock. And the selector for that would be button#rock (note the missing space between button and #rock).

And as @Greg already mentioned: #rock is already specific enough to target the button and could be used on its own.