Help! My shiny button isn't shiny! :(

[abathor]

I'm following this here tutorial> http://24ways.org/2008/shiny-happy-buttons

I should get this:



I have copied the html and css exactly, but instead of getting what I should, I get this:



I am using Firefox 3.0, and have also tried it in IE8, and it still doesn't work. Any ideas people?

EDIT: If I had tried linking my HTML to my actual fucking stylesheet, it might have worked!

Blink, please either leave this thread here as a testament to human stupidity, or delete it! It's up to you!

[no00dylan]

Leave it here, I want to watch him wallow in his stupidity.

I know nothing on html, so im actually worse

[Blink]

Moral here is, try a lot more things before making a thread!

[RefaelBA]

Nothing like two PNGs that would switch from "off" to "on" image on mouse-over.
It also looks exactly the same on EVERY browser, not like that shady tutorial you've used...

[Blink]

It's not shady, it's using advanced CSS to achieve something that images are required for normally.

But, here’s the catch. We’ll use no images, either in our HTML or our CSS. No sliding doors, no image replacement techniques. Just straight up, CSS, CSS3 and a bit of experimental CSS. And, it will be compatible with pretty much any browser (though with some progressive enhancement for those who keep up with the latest browsers).

[theblahman]

and then <button type="submit" id="button">This is a shiny button</button>

Better off using <input type="submit" id="button" value="This is a shiny button" /> since it's XHTML 1.0 Strict valid and works 100% in all browsers, unlike the button tag which doesn't work properly in Internet Explorer (although I'm unsure if it's still bugged in current versions of IE).