How to override bootstrap checkbox style

Question

I bought a bootstrap template, the style sheet file, has this code:

input[type=checkbox],
input[type=radio] {
  opacity: 0;
  position: absolute;
  left: -9999px;
  z-index: 12;
  width: 18px;
  height: 18px;
  cursor: pointer;
}

I have a html table that has a cell with a checkbox, that is not showing up, with chrome inspector, I modified turn off the styling properties,

My question Is there any way that I could tell my code not to apply that style in the checkbox that is inside the table cell??

thanks Alberto

Answer 1

yes, specifically call that check box add a class to the checkbox something like this <input type="checkbox" class="unique-class"/> then in your css add the style to just that checkbox with something like this

input.unique-class[type=checkbox],
input.unique-class[type=radio] {
/*stuff here*/
}

Answer 2

  input[type="radio"], input[type="checkbox"] {
    /*stuff here*/
    cursor:pointer;
  }