0

I have a tooltip attached to a checkbox. Here is the jQuery that controls it:

  $("#theform :input").tooltip({
  position: "center right",
  offset: [-2, 10],
  effect: "fade",
  opacity: 0.7
  });

Here is the CSS to control its appearance:

.tooltip {
  background-color:#000;
  border:1px solid #fff;
  padding:10px 15px;
  width:200px;
  display:none;
  color:#fff;
  text-align:left;
  font-size:12px;

 //For Firefox 
 -moz-box-shadow:0 0 10px #000;
 -webkit-box-shadow:0 0 10px #000;
}

And here is the code for the checkbox:

<input type="checkbox" name="End" id="End" value=1 title = "Tooltip text here" />

The style is not in its own sheet. It's part of the file where the jQuery code resides, wrapped in style tags. The tooltip itself is working; the CSS is not. I can't figure out why.

Chris
  • 535
  • 3
  • 20
  • possible duplicate of [overriding css jquery tooltip](http://stackoverflow.com/questions/4780759/overriding-css-jquery-tooltip) – showdev Feb 06 '14 at 17:57
  • 1
    Are you sure the CSS class of the tooltip is in fact `.tooltip`? Do you have a jsfiddle or anything you can share? – robabby Feb 06 '14 at 19:25

0 Answers0