diff --git a/core/ui/PageMacros.tid b/core/ui/PageMacros.tid
index 1b624a25b..56d18f782 100644
--- a/core/ui/PageMacros.tid
+++ b/core/ui/PageMacros.tid
@@ -8,8 +8,9 @@ title: $:/core/ui/PageMacros
 <<colour $name$>>
 \end
 
-\define tabs(tabsList,default,state:"$:/state/tab")
-<div class="tw-tab-buttons">
+\define tabs(tabsList,default,state:"$:/state/tab",class)
+<div class="tw-tab-set $class$">
+<div class="tw-tab-buttons $class$">
 	<$list filter="$tabsList$" variable="currentTab">
 		<$button set=<<qualify "$state$">> setTo=<<currentTab>> default="$default$" selectedClass="tw-tab-selected">
 			<$transclude tiddler=<<currentTab>> field="caption">
@@ -17,15 +18,14 @@ title: $:/core/ui/PageMacros
 			</$transclude>
 		</$button>
 	</$list>
-</div>
-<div class="tw-tab-divider"/>
-<div class="tw-tab-content">
+</div><div class="tw-tab-divider $class$"/><div class="tw-tab-content $class$">
 	<$list filter="$tabsList$" variable="currentTab">
 		<$reveal type="match" state=<<qualify "$state$">> text=<<currentTab>> default="$default$">
 			<$transclude tiddler=<<currentTab>> mode="block"/>
 		</$reveal>
 	</$list>
 </div>
+</div>
 \end
 
 \define wikitext-example(src)
diff --git a/core/ui/SideBar/More.tid b/core/ui/SideBar/More.tid
index 53362c478..29c212bd7 100644
--- a/core/ui/SideBar/More.tid
+++ b/core/ui/SideBar/More.tid
@@ -3,5 +3,5 @@ tags: $:/tags/SideBar
 caption: {{$:/language/SideBar/More/Caption}}
 
 <div class="tw-more-sidebar">
-<<tabs "[all[shadows+tiddlers]tag[$:/tags/MoreSideBar]!has[draft.of]]" "$:/core/ui/MoreSideBar/Tags" "$:/state/tab/moresidebar">>
+<<tabs "[all[shadows+tiddlers]tag[$:/tags/MoreSideBar]!has[draft.of]]" "$:/core/ui/MoreSideBar/Tags" "$:/state/tab/moresidebar" "tw-vertical">>
 </div>
diff --git a/editions/tw5.com/tiddlers/macros/TabsMacro.tid b/editions/tw5.com/tiddlers/macros/TabsMacro.tid
index d0999659f..9da4f78ca 100644
--- a/editions/tw5.com/tiddlers/macros/TabsMacro.tid
+++ b/editions/tw5.com/tiddlers/macros/TabsMacro.tid
@@ -1,17 +1,20 @@
 created: 20131228162203521
-modified: 20140225223527667
+modified: 20140509223527667
 tags: macros
 title: TabsMacro
 type: text/vnd.tiddlywiki
 
 The tabs macro displays a list of tiddlers as a tab control. The user can switch between tabs by clicking on them. The tabs are labelled with the title of the corresponding tiddler, unless there is a `caption` field present in which case it is used instead.
 
+By default the tab control arranges the tabs horizontally with the content underneath. You can also choose to have the tabs arranged vertically by passing the class `tw-vertical`.
+
 ! Parameters
 
 |!Position |!Name |!Description |!Default |
 |1st |tabsList |Filter giving the tiddlers to be displayed | |
 |2nd |default |Name of the tiddler containing the default tab | |
 |3rd |state |String to distinguish multiple tabs within the same tiddler (use of the system tiddler prefix is recommended) |''$:/state/tab'' |
+|4th |class |Additional CSS classes for the three wrappers DIV of the tab | |
 
 ! Examples
 
@@ -23,5 +26,4 @@ Here is an example of the tabs macro:
 
 <<tabs "Docs WikiText Features RoadMap" "WikiText" "$:/state/tab1">>
 
-<<tabs "[tag[tips]]" "GoogleChromeTips" "$:/state/tab1">>
-
+<<tabs "[tag[tips]]" "GoogleChromeTips" "$:/state/tab1" "tw-vertical">>
diff --git a/themes/tiddlywiki/vanilla/base.tid b/themes/tiddlywiki/vanilla/base.tid
index bd13ea888..6af8f06ca 100644
--- a/themes/tiddlywiki/vanilla/base.tid
+++ b/themes/tiddlywiki/vanilla/base.tid
@@ -959,7 +959,8 @@ canvas.tw-edit-bitmapeditor  {
 ** Tabs
 */
 
-.tw-tab-set {
+.tw-tab-set.tw-vertical {
+	white-space: nowrap;
 }
 
 .tw-tab-buttons {
@@ -968,6 +969,15 @@ canvas.tw-edit-bitmapeditor  {
 	margin-bottom: -1px;
 }
 
+.tw-tab-buttons.tw-vertical  {
+	display: inline-block;
+	padding-top: inherit;
+	vertical-align: top;
+	text-align: right;
+	margin-bottom: inherit;
+	margin-right: -1px;
+}
+
 .tw-tab-buttons button.tw-tab-selected {
 	color: <<colour tab-foreground-selected>>;
 	background-color: <<colour tab-background-selected>>;
@@ -978,9 +988,6 @@ canvas.tw-edit-bitmapeditor  {
 
 .tw-tab-buttons button {
 	color: <<colour tab-foreground>>;
-	padding: 2px 4px 4px 4px;
-	margin-left: 2px;
-	margin-right: 2px;
 	font-weight: 300;
 	border: none;
 	background: inherit;
@@ -990,16 +997,40 @@ canvas.tw-edit-bitmapeditor  {
 	border-right: 1px solid <<colour tab-border>>;
 }
 
+.tw-tab-buttons.tw-vertical button {
+	display: block;
+	width: 100%;
+	margin-top: 3px;
+	text-align: right;
+	background-color: <<colour tab-background>>;
+	border-left: 1px solid <<colour tab-border>>;
+	border-bottom: 1px solid <<colour tab-border>>;
+	border-right: none;
+}
+
+.tw-tab-buttons.tw-vertical button.tw-tab-selected {
+	background-color: <<colour tab-background-selected>>;
+	border-right: 1px solid <<colour tab-background-selected>>;
+}
+
 .tw-tab-divider {
 	border-top: 1px solid <<colour tab-divider>>;
 }
 
+.tw-tab-divider.tw-vertical  {
+	display: none;
+}
+
 .tw-tab-content {
 	padding-top: 14px;
 }
 
-.tw-sidebar-lists .tw-tab-buttons {
-	padding-top: 15px;	
+.tw-tab-content.tw-vertical  {
+	white-space: normal;
+	display: inline-block;
+	vertical-align: top;
+	padding-left: 14px;
+	border-left: 1px solid <<colour tab-border>>;
 }
 
 .tw-sidebar-lists .tw-tab-buttons button.tw-tab-selected {
@@ -1022,47 +1053,13 @@ canvas.tw-edit-bitmapeditor  {
 	border-top: 1px solid <<colour sidebar-tab-divider>>;
 }
 
-.tw-more-sidebar {
-	white-space: nowrap;
-}
-
-@media (min-width: 770px) {
-	.tw-more-sidebar {
-		margin-left: -14px;
-	}
-}
-
-.tw-more-sidebar .tw-tab-buttons {
-	display: inline-block;
-	vertical-align: top;
-	text-align: right;
-	padding-top: 0;
-	padding-left: 0;
-}
-
-.tw-more-sidebar .tw-tab-buttons button {
-	display: block;
-	width: 100%;
-	text-align: right;
-}
-
-.tw-sidebar-lists .tw-more-sidebar .tw-tab-divider {
-	display: none;
-}
-
-.tw-more-sidebar .tw-tab-content {
-	display: inline-block;
-	vertical-align: top;
-	padding-top: 0;
-	padding-left: 14px;
-}
-
 .tw-more-sidebar .tw-tab-buttons button {
 	background-color: <<colour sidebar-tab-background>>;
 	border-top: none;
 	border-left: none;
 	border-bottom: none;
 	border-right: 1px solid #ccc;
+	margin-bottom: inherit;
 }
 
 .tw-more-sidebar .tw-tab-buttons button.tw-tab-selected {