Joe -
If you are using the built-in mobile interface (which uses separate header/footer) the CSS to accommodate buttons should already be in there.
If your goal is to go responsive, and want CSS buttons for your desktop as well, look to the Bootstrap CSS files for the following code and tailor as you see fit. Or you can add this code to non-Bootstrap themes.
/*
===================
START:
BUTTONS
===================
*/
.pcButton
{
display: inline-block;
padding: 6px 12px;
margin: 2px;
white-space: nowrap;
text-align: center;
vertical-align: middle;
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background-image: none;
border: 1px solid transparent;
border-radius: 4px;
text-decoration: none;
text-transform: uppercase;
box-shadow: 0 0 3px rgba(0, 0, 0, 0.42);
border-color: #1A2874;
text-shadow: none;
background: #1F7A31;
border-bottom: 4px solid #074E07;
color: white;
}
a.pcButton
{
text-decoration: none;
color: #FFFFFF !important;
}
.pcButton
.pcButtonText {
display: block !important;
font-size: 14px;
font-weight: 700;
line-height: 1.42857143;
color: #FFFFFF;
}
.pcButton
img,
.pcButton
input[type="image"] {
display: none;
}
.pcButton:hover
{
}
.pcButtonAddToCart
{
}
.pcButtonAddToCart:hover
{
}
.pcButtonAddToCart
.pcButtonText {
}
.pcButtonMoreDetails
{
padding: 3px 6px !important;
}
.pcButtonMoreDetails:hover
{
padding: 3px 6px !important;
}
.pcButtonAddToCartSmall
{
padding: 3px 6px !important;
}
.pcButtonAddToCartSmall:hover
{
padding: 3px 6px !important;
}
.pcButtonMoreDetails
.pcButtonText,
.pcButtonAddToCartSmall
.pcButtonText {
font-size: 12px !important;
border-bottom-width: 3px;
}
.secondary
{
}
.secondary:hover
{
}
.secondary
.pcButtonText {
}
.tiny
{
padding: 3px 6px !important;
}
.tiny
.pcButtonText {
font-size: 10px !important;
}
a.pcMoreLink
{
font-size: 15px;
margin: 10px 0;
display: inline-block;
}
/*
===================
END:
BUTTONS
===================
*/
------------- GreyBeard Design Group
Certified ProductCart Developer
Web Design/Development/Hosting
http://tinyurl.com/5c8t4t" rel="nofollow - Add-Ons & Custom Code |
|