471,627 Members | 1,269 Online
Bytes | Software Development & Data Engineering Community
Post +

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 471,627 software developers and data experts.

How to render 3 images using single stylesheet class


Currently I have 3 stylesheet classes, each rendering an image as background. I have 3 images as..
  • Left half rounded
  • Middle covered area
  • Right half round

When I attach 1 of the classes to 'submit button', any one of the image is displayed as background. I want the button to display all three images.I will prefer to have single stylesheet class which renders all three background images in succession (i.e. no overwriting of images on each other). Please use my existing code as below.
Expand|Select|Wrap|Line Numbers
  1. .buttonInputLeft{
  2.     background: url("btn_left.gif") no-repeat left;
  3.     border-style: none;
  4.     font: bold;
  5.     color: white;
  6.     padding: 3px;
  7. }
  9. .buttonInputCenter{
  10.     border-style: none;
  11.     color: white;
  12.     background: url("btn_center.gif") no-repeat right;
  13.     padding: 3px;
  14.     font-family: Arial;
  15.     font-weight: bold;
  16. }
  18. .buttonInputRight{
  19.     background: url("btn_right.gif") no-repeat right;
  20.     border-style: none;
  21.     font: bold;
  22.     color: white;
  23.     padding: 3px;
  24. }
Will anyone help me?
Aug 23 '07 #1
0 1104

Post your reply

Sign in to post your reply or Sign up for a free account.

Similar topics

8 posts views Thread by drillbit_99 | last post: by
reply views Thread by Coldfire | last post: by
reply views Thread by leo001 | last post: by

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.