diff --git a/src/assets/css/header.css b/src/assets/css/header.css
index d16b9136c..6f3e931b0 100644
--- a/src/assets/css/header.css
+++ b/src/assets/css/header.css
@@ -171,6 +171,14 @@
     display: block;
 }
 
+.subheader-title {
+    text-overflow: ellipsis;
+    overflow: hidden;
+    display: inline-block;
+    width: calc(100% - 2rem);
+    line-height: 1.1rem;
+}
+
 .subheader-column {
     width: 50%;
     border-right: 1px solid #e1e7ec;
@@ -256,7 +264,6 @@
 
 .subheader-header {
     white-space: nowrap;
-    text-overflow: ellipsis;
     overflow: hidden;
     padding: .75rem 1.25rem;
     color: $brand-color-primary;
diff --git a/src/components/header/SubHeader.js b/src/components/header/SubHeader.js
index cdac2b091..7b18dcd81 100644
--- a/src/components/header/SubHeader.js
+++ b/src/components/header/SubHeader.js
@@ -183,7 +183,7 @@ class Subheader extends Component {
                         transparentBookmarks={!!siteName}
                         updateData={this.handleUpdateBreadcrumb}
                     >
-                        <span>
+                        <span className="subheader-title">
                             {currentNode ? currentNode.caption : siteName}
                         </span>
                     </BookmarkButton>