Revision: 13938
Updated Code
at May 13, 2009 11:20 by 1man
Updated Code
/* HTML: <a href="####" class="clickOrder"><span>Click here to order</span></a> */
#introBox .clickOrder {
background: url(../images/blueButtoneLeft.gif) no-repeat;/* Long image */
padding: 14px 0 14px 35px;/* Adjust padding depending on height */
float: left;/* Very important for IE6*/
/* Below for decoration */
text-decoration: none;
color: #fff;
font-weight: 700;
margin: 0 0 20px 20px;
}
#introBox .clickOrder span {
background: url(../images/blueButtoneRight.gif) top right no-repeat;/* Overlap Image */
padding: 12px 26px 14px 0;/* Padding to show the overlap image on the right */
}
Revision: 13937
Initial Code
Initial URL
Initial Description
Initial Title
Initial Tags
Initial Language
at May 13, 2009 11:19 by 1man
Initial Code
/* HTML: <a href="####" class="clickOrder"><span>Click here to order</span></a> */
#introBox .clickOrder {
background: url(../images/blueButtoneLeft.gif) top left no-repeat;/* Long image */
padding: 14px 0 14px 35px;/* Adjust padding depending on height */
float: left;/* Very important for IE6*/
/* Below for decoration */
text-decoration: none;
color: #fff;
font-weight: 700;
margin: 0 0 20px 20px;
}
#introBox .clickOrder span {
background: url(../images/blueButtoneRight.gif) top right no-repeat;/* Overlap Image */
padding: 12px 26px 14px 0;/* Padding to show the overlap image on the right */
}
Initial URL
Initial Description
Finally got round going through a sliding door example myself. All fairly straightforward apart from a few IE6 issues (who would have guessed!). The button is floated so you may need to add overflow: hidden to it's container.
Initial Title
Button Sliding Doors
Initial Tags
css, button
Initial Language
CSS