diff --git a/src/sql/base/browser/ui/panel/media/panel.css b/src/sql/base/browser/ui/panel/media/panel.css
index 209513521a..eca78fe0ab 100644
--- a/src/sql/base/browser/ui/panel/media/panel.css
+++ b/src/sql/base/browser/ui/panel/media/panel.css
@@ -24,7 +24,7 @@ panel {
 	position: relative;
 }
 
-.tabbedPanel.vertical>.title {
+.tabbedPanel.vertical > .title {
 	flex: 0 0 auto;
 	flex-direction: column;
 	height: 100%;
@@ -41,7 +41,6 @@ panel {
 	margin: 0 auto;
 	padding: 0;
 	justify-content: flex-start;
-	line-height: 35px;
 	white-space: nowrap;
 	flex: 1;
 	height: 100%;
@@ -50,17 +49,19 @@ panel {
 .tabbedPanel .tabList .tab {
 	cursor: pointer;
 	margin: auto;
+	display: flex;
+	flex-flow: row;
 }
 
-.tabbedPanel.horizontal .tabList .tab .tabLabel {
+.tabbedPanel.horizontal > .title .tabList .tab .tabLabel {
 	font-size: 12px;
-	font-weight: normal;
+	max-width: 100px;
 }
 
-.tabbedPanel.vertical .tabList .tab .tabLabel {
+.tabbedPanel.vertical >.title .tabList .tab .tabLabel {
 	font-size: 13px;
 	padding-bottom: 0px;
-	font-weight: normal;
+	max-width: 200px;
 }
 
 .tabbedPanel .tabList .tab .tabLabel {
@@ -69,6 +70,14 @@ panel {
 	font-weight: 600;
 }
 
+.tabbedPanel.horizontal > .title .tabList .tab .tabLabel,
+.tabbedPanel.vertical > .title .tabList .tab .tabLabel {
+	text-overflow: ellipsis;
+	overflow: hidden;
+	border: 0px;
+	font-weight: normal;
+}
+
 .tabbedPanel .tabList .tab-header {
 	display: flex;
 	padding-left: 5px;
@@ -124,23 +133,29 @@ panel {
 	flex-direction: row;
 }
 
-.tabbedPanel.vertical>.title {
+.tabbedPanel.vertical > .title {
 	flex: 0 0 auto;
 	flex-direction: column;
 	height: 100%;
 }
 
-.tabbedPanel>.tab-content {
+.tabbedPanel > .tab-content {
 	flex: 1 1 auto;
 	position: relative;
 }
 
-.tabbedPanel.vertical>.title > .tabContainer .tabList {
+.tabbedPanel.vertical > .title > .tabContainer .tabList {
 	flex-flow: column;
+	height: calc(100% - 35px);
+	overflow: auto;
+	line-height: 35px;
 }
 
 .tabbedPanel.horizontal > .title > .tabContainer .tabList {
 	flex-flow: row;
+	width: 100%;
+	overflow: auto;
+	line-height: 35px;
 }
 
 .tabbedPanel > .title > .tabContainer > .monaco-scrollable-element {
diff --git a/src/sql/base/browser/ui/panel/panel.component.ts b/src/sql/base/browser/ui/panel/panel.component.ts
index cd35561468..e7e465b0dd 100644
--- a/src/sql/base/browser/ui/panel/panel.component.ts
+++ b/src/sql/base/browser/ui/panel/panel.component.ts
@@ -58,7 +58,7 @@ let idPool = 0;
 					<div *ngIf="options.layout === NavigationBarLayout.vertical" class="vertical-tab-action-container">
 						<button [attr.aria-expanded]="_tabExpanded" [title]="toggleTabPanelButtonAriaLabel" [attr.aria-label]="toggleTabPanelButtonAriaLabel" [ngClass]="toggleTabPanelButtonCssClass" tabindex="0" (click)="toggleTabPanel()"></button>
 					</div>
-					<div [style.display]="_tabExpanded ? 'flex': 'none'" [attr.aria-hidden]="_tabExpanded ? 'false': 'true'" class="tabList" role="tablist" scrollable [horizontalScroll]="AutoScrollbarVisibility" [verticalScroll]="HiddenScrollbarVisibility" [scrollYToX]="true" (keydown)="onKey($event)">
+					<div [style.display]="_tabExpanded ? 'flex': 'none'" [attr.aria-hidden]="_tabExpanded ? 'false': 'true'" class="tabList" role="tablist" (keydown)="onKey($event)">
 						<div role="presentation" *ngFor="let tab of _tabs">
 							<ng-container *ngIf="tab.type!=='group-header'">
 								<tab-header role="presentation" [active]="_activeTab === tab" [tab]="tab" [showIcon]="options.showIcon" (onSelectTab)='selectTab($event)' (onCloseTab)='closeTab($event)'></tab-header>
diff --git a/src/sql/base/browser/ui/panel/tabHeader.component.ts b/src/sql/base/browser/ui/panel/tabHeader.component.ts
index 12aa962493..76fa6e2572 100644
--- a/src/sql/base/browser/ui/panel/tabHeader.component.ts
+++ b/src/sql/base/browser/ui/panel/tabHeader.component.ts
@@ -20,14 +20,11 @@ import { CloseTabAction } from 'sql/base/browser/ui/panel/tabActions';
 	selector: 'tab-header',
 	template: `
 		<div #actionHeader role="tab" [attr.aria-selected]="tab.active" [attr.aria-label]="tab.title" class="tab-header" style="flex: 0 0; flex-direction: row;" [class.active]="tab.active" tabindex="0" (click)="selectTab(tab)" (keyup)="onKey($event)">
-			<span class="tab" role="presentation">
-				<div role="presentation">
-					<a #tabIcon></a>
-					<a class="tabLabel" [class.active]="tab.active" #tabLabel>
-					</a>
-				</div>
-			</span>
-			<span #actionbar style="flex: 0 0 auto; align-self: end; margin-top: auto; margin-bottom: auto;" ></span>
+			<div class="tab" role="presentation">
+				<a #tabIcon></a>
+				<a class="tabLabel" [class.active]="tab.active" [title]="tab.title" #tabLabel></a>
+			</div>
+			<div #actionbar style="flex: 0 0 auto; align-self: end; margin-top: auto; margin-bottom: auto;" ></div>
 		</div>
 	`
 })