BradTrupp.com --
Tags --
Old Articles -- CSS 3D Push Button Effect (Website Tips)
CSS 3D Push Button Effect (Website Tips)
(2008/10/14)
Back in the early days of the Web, 3D buttons that appeared to become pushed when you mouse over them were all the rage. With CSS, this is even easier. No javascript necessary.
The CSS commands you'll need are:
a {
display: block;
border: 1px solid;
border-color: #aaa #000 #000 #aaa;
width: 8em;
background: #fc0;
}
![]()
a:hover
{
position: relative;
top: 1px;
left: 1px;
border-color: #000 #aaa #aaa #000;
}
|
Pop these into your stylesheet and you are good to go...
Tags: Old Articles
Share: Del.icio.us | Digg | Facebook | Google Bookmarks | Reddit | Technorati | Twitter | Windows Live | Yahoo! My Web