How do I make rounded Jquery UI tooltips?

Question

This is the css in my stylesheet. Weather I use ui-tooltip or make my own custom tooltip class and specifiy it in the tooltip initialization, it doesnt round the corners. I'm assuming there is some css priority conflict, but I am completely new to css and not sure of its underworkings yet.

I really just need round corners.

.ui-tooltip {
  position: absolute;
    background: #f9a235;
    color: #fff;
    padding: 6px 0px; 
    border-width: 1px;
    border-radius: 25px;
  }

Answer 1

What's not working about your current implementation?

Working Demo in Fiddle

This should be doing the trick:

.ui-tooltip {
    border-radius: 25px;
}

Screenshot:

Make sure to check for browser compatibility as this won't work in IE8:
http://caniuse.com/border-radius