SHARE
TWEET

multi styling checkboxes css

johnny4000 Nov 26th, 2011 4,555 Never
  1.  .checkbox, .radio {
  2.     width: 19px;
  3.     height: 25px;
  4.     padding: 0px;  
  5.     background: url(/path_to_image/icon.png) no-repeat;
  6.     display: block;
  7.     clear: left;
  8.     float: left;
  9.  }
  10.  
  11.  .green {
  12.     background-color: green;
  13.  }
  14.  
  15.  .red {
  16.     background-color: red;
  17.  }
  18.  
  19. .radio {
  20.   background: url(radio.gif) no-repeat;
  21. }
  22. .select {
  23.   position: absolute;
  24.   width: 158px; /* With the padding included, the width is 190 pixels: the actual width of the image. */
  25.   height: 21px;
  26.   padding: 0 24px 0 8px;
  27.   color: #fff;
  28.   font: 12px/21px arial,sans-serif;
  29.   background: url(select.gif) no-repeat;
  30.   overflow: hidden;
  31. }
  32.  
RAW Paste Data
Top