jquery ui resizable issue

Question

I am using jquery-ui-1.9.2 and jquery-ui dialog, on mimimizing the dialogs they get into a container to the left side of the screen, i made the dialog container resizable by using the following code

$(function() {
    $( ".container" ).resizable();
});

and the css for it:

.container {
    position:fixed;
    width: 200px;
    height: auto;
    border: 1px solid #CCCCCC;
    overflow: scroll
}

Now here clearly mentioned that container must show scrollbars only on overflow. This works fine if i take off the resizable function, but if i use that function then scrollbars appear on page load itself.

How do i get rid of this?

Answer 1

well i figured it out myself. just changed the resizable() as shown below

$(function() {
$( ".container" ).resizable({ handles: "e" });
 });

Now the scrollbars appear only on overflow.

Answer 2

Replace overflow: scroll with overflow: auto