diff --git a/src/tabs/docs/demo.html b/src/tabs/docs/demo.html
index f16e31da19..0a2f4924be 100644
--- a/src/tabs/docs/demo.html
+++ b/src/tabs/docs/demo.html
@@ -1,10 +1,22 @@
 <div ng-controller="TabsDemoCtrl">
+    <h3>Basic tabs</h3>
     <tabs>
-        <pane heading="Static title">Static content</pane>
-        <pane ng-repeat="pane in panes" heading="{{pane.title}}" active="pane.active">{{pane.content}}</pane>
+        <pane heading="Static title" style="padding-bottom: 9px; border-bottom: 1px solid #ddd;">
+            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin lacinia, ante sit amet pharetra vulputate, augue velit dignissim libero, in blandit neque sapien at sapien. Sed lacinia tellus quis risus consectetur egestas. In hac habitasse platea dictumst.
+        </pane>
+        <pane ng-repeat="pane in panes" heading="{{pane.title}}" active="pane.active" style="padding-bottom: 9px; border-bottom: 1px solid #ddd;">{{pane.content}}</pane>
+    </tabs>
+    <p>
+        <button class="btn btn-mini" ng-click="panes[0].active = true">Select second tab</button>
+        <button class="btn btn-mini" ng-click="panes[1].active = true">Select third tab</button>
+    </p>
+    <h3>Different tab placements</h3>
+    <h4>Left</h4>
+    <tabs placement="left">
+        <pane ng-repeat="pane in panes" heading="{{pane.title}}">{{pane.content}}</pane>
+    </tabs>
+    <h4>Right</h4>
+    <tabs placement="right">
+        <pane ng-repeat="pane in panes" heading="{{pane.title}}">{{pane.content}}</pane>
     </tabs>
-    <div class="row-fluid">
-        <button class="btn" ng-click="panes[0].active = true">Select second tab</button>
-        <button class="btn" ng-click="panes[1].active = true">Select third tab</button>
-    </div>
 </div>
\ No newline at end of file
diff --git a/src/tabs/docs/readme.md b/src/tabs/docs/readme.md
index 3c746c49eb..26a4a0b8df 100644
--- a/src/tabs/docs/readme.md
+++ b/src/tabs/docs/readme.md
@@ -1 +1,7 @@
-AngularJS version of the tabs directive.
\ No newline at end of file
+AngularJS version of the tabs directive.
+
+Individual tabs can be created statically, from markup, or generated from model using the `ng-repeat directive`.
+
+Tabs selection can be driven by mouse `click` event or in response to model changes (see the `active` attribute).
+
+It is also possible to change placement of tabs using the `placement` attribute.
diff --git a/src/tabs/tabs.js b/src/tabs/tabs.js
index b05d75f1b2..4d48fa1383 100644
--- a/src/tabs/tabs.js
+++ b/src/tabs/tabs.js
@@ -29,7 +29,9 @@ angular.module('ui.bootstrap.tabs', [])
   return {
     restrict: 'EA',
     transclude: true,
-    scope: {},
+    scope: {
+      placement: '@'
+    },
     controller: 'TabsController',
     templateUrl: 'template/tabs/tabs.html',
     replace: true
diff --git a/template/tabs/tabs.html b/template/tabs/tabs.html
index 06e92f3750..6cf80b19ce 100644
--- a/template/tabs/tabs.html
+++ b/template/tabs/tabs.html
@@ -1,4 +1,4 @@
-<div class="tabbable">
+<div class="tabbable"  ng-class='placement && "tabs-" + placement'>
   <ul class="nav nav-tabs">
     <li ng-repeat="pane in panes" ng-class="{active:pane.selected}">
       <a href="" ng-click="select(pane)">{{pane.heading}}</a>