diff --git a/chrome/content/zotero/zoteroPane.xhtml b/chrome/content/zotero/zoteroPane.xhtml
index ac7ff286fa..a4d0773a3b 100644
--- a/chrome/content/zotero/zoteroPane.xhtml
+++ b/chrome/content/zotero/zoteroPane.xhtml
@@ -195,7 +195,7 @@
 	
 	<vbox id="titlebar">
 		<hbox class="titlebar-icon-container">
-			<image class="titlebar-icon" src="chrome://zotero/skin/z.svg"></image>
+			<html:div class="titlebar-icon"></html:div>
 		</hbox>
 		<!-- Menu -->
 		<toolbar type="menubar" id="toolbar-menubar" class="chromeclass-menubar" customizable="true"
diff --git a/scss/linux/_titleBar.scss b/scss/linux/_titleBar.scss
index 3ef9a37263..e3e1dd9f93 100644
--- a/scss/linux/_titleBar.scss
+++ b/scss/linux/_titleBar.scss
@@ -59,6 +59,9 @@
  * window state. Otherwise, elements in the navigator-toolbox, like the menubar,
  * can swallow those events. */
 .titlebar-buttonbox {
+	right: 0px;
+	position: absolute;
+	height: var(--tab-min-height);
 	z-index: 1;
 	display: flex;
 	align-items: center;
diff --git a/scss/win/_titleBar.scss b/scss/win/_titleBar.scss
index c572a5dfa6..60ae5b28bf 100644
--- a/scss/win/_titleBar.scss
+++ b/scss/win/_titleBar.scss
@@ -44,11 +44,14 @@
 }
 
 .titlebar-icon {
+	background-image: url(chrome://zotero/skin/z.svg);
+	width: 16px;
+	height: 16px;
+	z-index: 2;
 	-moz-window-dragging: no-drag;
 	pointer-events: all;
 	// to make the icon 36*36
 	margin: 10px;
-	object-fit: none;
 }
 
 
@@ -110,6 +113,9 @@
 /* Titlebar */
 
 .titlebar-buttonbox {
+	right: 0px;
+	position: absolute;
+	height: var(--tab-min-height);
 	appearance: none;
 	/* The button box must appear on top of the navigator-toolbox in order for
 	 * click and hover mouse events to work properly for the button in the restored