Tabs: Calculate border and padding on tabs container. Fixed #8836: He…

…ight overflows parent with heightStyle: 'fill'.
jquery · Nov 26, 2012 · 6121683 · 6121683
1 parent ee8d20e
commit 6121683
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 1 deletion.
diff --git a/tests/unit/tabs/tabs_options.js b/tests/unit/tabs/tabs_options.js
@@ -235,10 +235,18 @@ test( "{ heightStyle: 'content' }", function() {
 });
 
 test( "{ heightStyle: 'fill' }", function() {
-	expect( 2 );
+	expect( 4 );
 	$( "#tabs8Wrapper" ).height( 500 );
 	var element = $( "#tabs8" ).tabs({ heightStyle: "fill" });
 	equalHeight( element, 485 );
+	element.tabs( "destroy" );
+
+	element = $( "#tabs8" ).css({
+		"border": "1px solid black",
+		"padding": "1px 0"
+	});
+	element.tabs({ heightStyle: "fill" });
+	equalHeight( element, 481 );
 });
 
 test( "{ heightStyle: 'fill' } with sibling", function() {

diff --git a/ui/jquery.ui.tabs.js b/ui/jquery.ui.tabs.js
@@ -497,6 +497,8 @@ $.widget( "ui.tabs", {
 
 		if ( heightStyle === "fill" ) {
 			maxHeight = parent.height();
+			maxHeight -= this.element.outerHeight() - this.element.height();
+
 			this.element.siblings( ":visible" ).each(function() {
 				var elem = $( this ),
 					position = elem.css( "position" );