Removing border from tab ui control

Question

I have the following script:

http://jsfiddle.net/2HNvL/

but I can't seem to remove the light gray border around the tab control. Anyone here know how to do that?

I have tried the following:

    #tabs .ui-widget { border:none;  padding:0px; margin:0px; }
    #tabs .ui-widget-header { border:none; display:none; padding:0px; margin:0px; }
    #tabs .ui-widget-content { border:none; padding:0px; margin:0px; }

But that does not work.

Answer 1

Adding to your list a simple #tabs {border: none} should do the job.