How to scroll jQuery ui tabs?

I think I have a solution for you, if i understand your question correctly. Here's the live example on jsFiddle.

I added two classes, one that's applied to the overall tab element and one that's applied to each tab panel.

.container{    width: 600px;}.panel{    height: 150px;    overflow: auto;}

(The container class could also be renamed to ui-tabs so that you add to the jQuery UI ui-tabs class, and the panel class could be renamed to ui-tabs-panel so that you add to the jQuery UI ui-tabs-panel class.)

Here's the mark-up that I used...

<div class='main'>    <div id="tabs" class='container'>        <ul>            <li><a href="#tabs-1">Tab 1</a></li>            <li><a href="#tabs-2">Tab 2</a></li>        </ul>        <div id="tabs-1" class='panel'>            <p>tab1 text...</p>        </div>        <div id="tabs-2" class='panel'>            <p>tab2 text...</p>        </div>    </div></div>

When I hook this up with some jQuery UI tab magic:

$(document).ready(function() {    $("#tabs").tabs();});

I end up with a single scroll bar inside the tab.

I hope this helps!

just use css for ui-tab-content class its like add the css code to any where in your style sheets hope you will be done.

.ui-tab-content, .ui-tabs-panel{overflow: auto;}

Thanks