Search code examples
jquerycssjquery-uijquery-ui-tabsjquery-ui-sortable

Tabs not resizing properly for sortables


I have the following script:

http://jsfiddle.net/oshirowanen/mYx5y/3/

Why is the height of the tab which contains the sortable elements not resizing it's height properly to contain all the sortable elements?


Solution

  • The column element within the tabs are floated and needs a clear after so the tabs div is the right height.

    A quick fix would just be to use clearfix. use the following css:

    .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
    
    .clearfix { display: inline-block; }
    
    * html .clearfix { height: 1%; } /* Hides from IE-mac \*/
    
    .clearfix { display: block; }
    

    and give the div with id="tabs" a class="clearfix"