Settings controls to bottom

src/vs/workbench/parts/preferences/browser/media/settingsEditor2.css

@@ -126,7 +126,6 @@
 .settings-editor > .settings-body > .settings-tree-container .setting-item {
 	cursor: default;
 	white-space: normal;
-	display: flex;
 	height: 100%;
 	min-height: 75px;
 }
@@ -195,6 +194,10 @@
 	height: initial;
 }
 
+.settings-editor > .settings-body > .settings-tree-container .setting-item .setting-item-value {
+	display: inline-block;
+}
+
 .settings-editor > .settings-body > .settings-tree-container .setting-item .setting-item-value > .edit-in-settings-button,
 .settings-editor > .settings-body > .settings-tree-container .setting-item .setting-item-value > .edit-in-settings-button:hover,
 .settings-editor > .settings-body > .settings-tree-container .setting-item .setting-item-value > .edit-in-settings-button:active {
@@ -208,7 +211,7 @@
 }
 
 .settings-editor > .settings-body > .settings-tree-container .setting-item .monaco-select-box {
-	width: 100%;
+	width: initial;
 	font: inherit;
 	height: 26px;
 }
@@ -228,7 +231,7 @@
 .settings-editor > .settings-body > .settings-tree-container .setting-item .expand-indicator {
 	visibility: hidden;
 	position: absolute;
-	bottom: -2px;
+	bottom: 52px;
 	width: calc(100% - 190px);
 	text-align: center;
 	opacity: .5;

src/vs/workbench/parts/preferences/browser/settingsTree.ts

@@ -258,7 +258,7 @@ export interface ISettingChangeEvent {
 
 export class SettingsRenderer implements IRenderer {
 
-	private static readonly SETTING_ROW_HEIGHT = 75;
+	private static readonly SETTING_ROW_HEIGHT = 110;
 
 	private readonly _onDidChangeSetting: Emitter<ISettingChangeEvent> = new Emitter<ISettingChangeEvent>();
 	public readonly onDidChangeSetting: Event<ISettingChangeEvent> = this._onDidChangeSetting.event;
@@ -346,18 +346,15 @@ export class SettingsRenderer implements IRenderer {
 	private renderSettingTemplate(tree: ITree, container: HTMLElement): ISettingItemTemplate {
 		DOM.addClass(container, 'setting-item');
 
-		const leftElement = DOM.append(container, $('.setting-item-left'));
-		const rightElement = DOM.append(container, $('.setting-item-right'));
-
-		const titleElement = DOM.append(leftElement, $('.setting-item-title'));
+		const titleElement = DOM.append(container, $('.setting-item-title'));
 		const categoryElement = DOM.append(titleElement, $('span.setting-item-category'));
 		const labelElement = DOM.append(titleElement, $('span.setting-item-label'));
 		const isConfiguredElement = DOM.append(titleElement, $('span.setting-item-is-configured-label'));
 		const otherOverridesElement = DOM.append(titleElement, $('span.setting-item-overrides'));
-		const descriptionElement = DOM.append(leftElement, $('.setting-item-description'));
-		const expandIndicatorElement = DOM.append(leftElement, $('.expand-indicator'));
+		const descriptionElement = DOM.append(container, $('.setting-item-description'));
+		const expandIndicatorElement = DOM.append(container, $('.expand-indicator'));
 
-		const valueElement = DOM.append(rightElement, $('.setting-item-value'));
+		const valueElement = DOM.append(container, $('.setting-item-value'));
 
 		const toDispose = [];
 		const template: ISettingItemTemplate = {