[Summary view] [Print] [Text view]

   1  /* hide the checkboxes and radios */

   2  input[type="checkbox"],input[type="radio"]
   3  {
   4      opacity: 0;
   5      position: absolute;
   6      width:14px;
   7      height: 14px;
   8      margin: 4px 2px;
   9      margin-top: 2px\9;
  10  }
  11  label{
  12      display: inline-block;
  13  }
  14  /* Inline div for placeholder to the checkbox*/

  15  .chkbox, .radiobtn {
  16      display: inline;
  17      margin-right: 20px\9;
  18  }
  19  /* Fix for IE */

  20  :root .chkbox, :root .radiobtn {
  21      margin-right: 0px\9;
  22  }
  23  /* we use generated content to create a placeholder for the checkbox*/

  24  input[type="checkbox"] + div::before,
  25  input[type="radio"] + div::before
  26  {
  27      content: "";
  28      display: inline-block;
  29      width: 17px;
  30      height: 17px;
  31      margin: -2px 8px 0 0;
  32      background: url("check_radio_sprite.png") no-repeat 0 -17px;
  33      vertical-align: middle;
  34  }
  35  /* hover checkbox (unselected state only) */

  36  input[type="checkbox"]:not(:checked):hover + div::before
  37  {
  38      background-position: 0 -68px;
  39  }
  40  /* selected checkbox */

  41  input[type="checkbox"]:checked + div::before
  42  {
  43      background-position: 0 0;
  44  }
  45  /* disabled checkbox*/

  46  input[type="checkbox"]:disabled + div::before
  47  {
  48      background-position: 0 -51px;
  49      opacity: 0.6;
  50  }
  51  /* disabled checked checkbox*/ 

  52  input[type="checkbox"]:disabled:checked + div::before
  53  {
  54      background-position: 0 -34px;
  55      opacity: 0.6;
  56  }
  57  /*Unselected Radio */

  58  input[type="radio"] + div::before
  59  {
  60      background-position: -17px -17px;
  61  }
  62  /* radio hover (unselected state only) */

  63  input[type="radio"]:hover + div::before
  64  {
  65      background-position: -17px -68px;
  66  }
  67  /* selected radio */

  68  input[type="radio"]:checked + div::before
  69  {
  70      background-position: -17px 0px;
  71  }
  72  /* disabled radio*/

  73  input[type="radio"]:disabled + div::before
  74  {
  75      background-position: -17px -51px;
  76      opacity: 0.6;
  77  }
  78  /* disabled checked radio*/ 

  79  input[type="radio"]:disabled:checked + div::before
  80  {
  81      background-position: -17px -34px;
  82      opacity: 0.6;
  83  }
  84  /* Single line text box*/

  85  input[type="text"], input[type="password"] {
  86      border: 1px solid #ccc;
  87      border-radius: 3px;
  88      box-shadow: 1px 1px 2px #ddd;
  89      height: 30px !important;
  90      width: 180px;
  91      margin-bottom:0px;
  92  }