diff --git a/src/tabs/docs/demo.html b/src/tabs/docs/demo.html
index 40dda435bd..818e316140 100644
--- a/src/tabs/docs/demo.html
+++ b/src/tabs/docs/demo.html
@@ -25,4 +25,12 @@
Vertical content 1
Vertical content 2
+
+
+
+
+ Justified content
+ Short Labeled Justified content
+ Long Labeled Justified content
+
diff --git a/src/tabs/docs/readme.md b/src/tabs/docs/readme.md
index 75f5c60fdb..daee59f2fd 100644
--- a/src/tabs/docs/readme.md
+++ b/src/tabs/docs/readme.md
@@ -8,6 +8,10 @@ AngularJS version of the tabs directive.
_(Defaults: false)_ :
Whether tabs appear vertically stacked.
+ * `justified`
+ _(Defaults: false)_ :
+ Whether tabs fill the container and have a consistent width.
+
* `type`
_(Defaults: 'tabs')_ :
Navigation type. Possible values are 'tabs' and 'pills'.
diff --git a/src/tabs/tabs.js b/src/tabs/tabs.js
index ce5d1b9923..0a368a2fb6 100644
--- a/src/tabs/tabs.js
+++ b/src/tabs/tabs.js
@@ -48,19 +48,24 @@ angular.module('ui.bootstrap.tabs', [])
* Tabset is the outer container for the tabs directive
*
* @param {boolean=} vertical Whether or not to use vertical styling for the tabs.
+ * @param {boolean=} justified Whether or not to use justified styling for the tabs.
*
* @example
- First Content!
- Second Content!
+ First Content!
+ Second Content!
First Vertical Content!
Second Vertical Content!
+
+ First Justified Content!
+ Second Justified Content!
+
*/
@@ -74,6 +79,7 @@ angular.module('ui.bootstrap.tabs', [])
templateUrl: 'template/tabs/tabset.html',
link: function(scope, element, attrs) {
scope.vertical = angular.isDefined(attrs.vertical) ? scope.$parent.$eval(attrs.vertical) : false;
+ scope.justified = angular.isDefined(attrs.justified) ? scope.$parent.$eval(attrs.justified) : false;
scope.type = angular.isDefined(attrs.type) ? scope.$parent.$eval(attrs.type) : 'tabs';
}
};
diff --git a/src/tabs/test/tabs.spec.js b/src/tabs/test/tabs.spec.js
index 2ead88c5cf..72f4c3613f 100644
--- a/src/tabs/test/tabs.spec.js
+++ b/src/tabs/test/tabs.spec.js
@@ -546,6 +546,19 @@ describe('tabs', function() {
});
});
+ describe('justified', function() {
+ beforeEach(inject(function($compile, $rootScope) {
+ scope = $rootScope.$new();
+ scope.justified = true;
+ elm = $compile('')(scope);
+ scope.$apply();
+ }));
+
+ it('to justify tabs', function() {
+ expect(elm.find('ul.nav-tabs')).toHaveClass('nav-justified');
+ });
+ });
+
describe('type', function() {
beforeEach(inject(function($compile, $rootScope) {
scope = $rootScope.$new();
diff --git a/template/tabs/tabset.html b/template/tabs/tabset.html
index ffe289f882..66a529658c 100644
--- a/template/tabs/tabset.html
+++ b/template/tabs/tabset.html
@@ -1,7 +1,6 @@