Sometimes, the box where you input the CSS rules will shake when you click on the hint box. Not sure if this is supposed to happen or not, but it was unexpected from me.
Otherwise, I thought this was pretty neat and very informative. Good job and thanks for sharing!
The input boxes run a validation check whenever the user presses enter or focuses out of them; if this check determines the input value to be invalid, the stylesheet will shake.
In your case, you were probably typing some input before you clicked the hint box, thus focusing out of the input and invoking the validation check.
Okay, but this validation happens instead of opening the help dialog. Whatever event triggers there eats the button click.
When typing an incorrect input, the first place a user will go to fix it is the help. It's a bit of a catch-22 when the help button will only help you after you fix your typos.
Otherwise, I thought this was pretty neat and very informative. Good job and thanks for sharing!