mostlylucid

scott galloway's personal blog...
posts - 916, comments - 758, trackbacks - 11

My Links

News

Archives

Post Categories

Misc. Coding

Cool little tip - change buttons to look like linkbuttons

From the ‘don’t comprimise design for accessibility’ stable comes this little tip – how to make a submit button look like a link button:

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<!-- dean.edwards/2004 -->
<!-- keeping code tidy! -->
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
        <!-- compliance patch for microsoft browsers -->
        <!--[if lt IE 7]>
<script src="ie7-standard.js" type="text/javascript">
</script>
<![endif]-->
        <style type="text/css">
 input[type="submit"] { border: 0px inset;
 background-color: transparent;
 color: blue;
text-decoration: none;
 cursor: pointer; }
 input[type="submit"]:hover {
 color: red;}
        </style>
    </head>
    <body>
        <form ID="Form1">
            <input type="submit" value="My Link Button" ID="Submit1" NAME="Submit1" />
        </form>
    </body>
</html>

 

OK, not that simple, this also uses the excellent IE7 stuff from Dean Edwards to enable IE 6 to support CSS properly…for stuff like :hover and CSS selectors (input[type="submit"]).

Reason for this? LinkButtons use Javascript and are not usable from Text Readers…

Print | posted on Tuesday, March 22, 2005 5:18 PM | Filed Under [ Accessibility ]

Comments have been closed on this topic.

Powered by: