Let’s fix this and see no more [BUTTON] tags , [input type=image /] or dirty CSS /HTML / JS for this simple lovely button.
http://www.hedgerwow.com/360/dhtml/ui-css-input-replacement/demo.php
BTW, what’s the difference between Link and Button?
( one of my interview question for interaction designer)
Pras | 23-Nov-07 at 11:00 am | Permalink
Love your stuff Hedger. But I have to ask, what is wrong with using BUTTON tags and INPUT IMAGE tags especially if you’re using a non-rollover image?
How is this method better in terms of accessibility (comparing your method to BUTTON)?
One of the advantages that I see in your method is consistency across browsers. I use Camino for my browsing and a simple BUTTON tag will be rendered as a default glossy button even if there is a CSS background property. Your method seems to work fine in Camino, good stuff!
Hedger | 23-Nov-07 at 4:02 pm | Permalink
Hi, Pras:
Button is troublesome, it may work inconsistently across browsers.
For Internet Explorer, there’s an issue which people hate a lot, and here’s the documentation :http://www.peterbe.com/plog/button-tag-in-IE
and on Safari, even you place a BUTTON within a FORM, but BUTTON does not belong to the FORM collection :FORM.elements.
Most people use BUTTON simply for better control with visual treatment, and it turns out that the abusive use of IMG or TABLE may be implemented.
If visual design is not your concern, you should never use BUTTON for production.
I try to let people keep using INPUT[type=BUTTON] or INPUT[type=SUBMIT] with more flexible visual design control.
It’s the balance of visual design and implementation of good practice.
thanks.
Saz | 30-Nov-07 at 4:12 am | Permalink
Hi,
I’d like to debate the accessibility of this method.
When you remove the CSS, it’s difficult to understand what’s going on.
Nice Site.
thanks.
werbeagentur | 10-Dec-07 at 3:20 am | Permalink
Interesting method - but not working on all browsers.
hedgerwang | 14-Dec-07 at 5:04 pm | Permalink
hi, I’d love to know which browser is not working?
Leslie Marshall | 12-Jan-08 at 12:39 am | Permalink
Interested in knowing if you have a solution for rendering buttons correctly when they are disabled.