I originally posted about "Gremlins" in the "A Book About Hype" thread. Considering that the thread is over 200 posts long, most people probably didn't see it. So, I'm posting about the problem here.
If you cut and paste code from A Book About Hype, it adds some extra text. It probably looks something like this...
Excerpt From: Michael Garofalo. “A Book About Hype.” Photics, 2015.
So you probably delete the extra text and think the code's OK. But after pasting the code into Hype, the code doesn't work. The problem is that there are hidden characters included in the code. They're highlighted below with a red "X".
To fix the code, those gremlins need to be deleted. That's easy to do with TextWrangler.
There's an option in the Menu Bar "Text > Zap Gremlins". I used an emoji to highlight the bad characters. It makes them easier to spot. From there, you can just delete them. To be fancy, a simple Find (the special character) and Replace (with nothing) should clean up the code nicely. (You could also use the "Delete" option from the "Zap Gremlins" dialogue window, but I personally prefer to see the gremlins before deleting them.)
Also, if you're trying the code from the first screenshot, it's important to know of a fairly new Hype setting... it's the "Position with CSS left/top" in the "Advanced Options" section of the "Document" tab. If you want to use top/left positioning, then that option probably needs to be checked.