diff --git a/app/assets/javascripts/discourse/templates/components/home-logo.hbs b/app/assets/javascripts/discourse/templates/components/home-logo.hbs
index b2b8f9e6db7..976aefd88fe 100644
--- a/app/assets/javascripts/discourse/templates/components/home-logo.hbs
+++ b/app/assets/javascripts/discourse/templates/components/home-logo.hbs
@@ -1,15 +1,18 @@
 <a href="{{unbound linkUrl}}" data-auto-route="true">
   {{#if showSmallLogo}}
     {{#if smallLogoUrl}}
+      <span class="valign-helper"></span>
       <img class="logo-small" src="{{unbound smallLogoUrl}}" width="33" height="33">
     {{else}}
       <i class="fa fa-home"></i>
     {{/if}}
   {{else}}
     {{#if showMobileLogo}}
+      <span class="valign-helper"></span>
       <img id="site-logo" class="logo-big" src="{{unbound mobileBigLogoUrl}}" alt="{{unbound title}}">
     {{else}}
       {{#if bigLogoUrl}}
+        <span class="valign-helper"></span>
         <img id="site-logo" class="logo-big" src="{{unbound bigLogoUrl}}" alt="{{unbound title}}">
       {{else}}
         <h2 id="site-text-logo" class="text-logo">{{unbound title}}</h2>
diff --git a/app/assets/stylesheets/common/base/header.scss b/app/assets/stylesheets/common/base/header.scss
index 74e9803c1ed..8549fabc482 100644
--- a/app/assets/stylesheets/common/base/header.scss
+++ b/app/assets/stylesheets/common/base/header.scss
@@ -16,12 +16,13 @@
     }
 
     .title {
-      display: table;
       float: left;
-      > a {
-        display: table-cell;
-        vertical-align: middle;
-      }
+    }
+
+    .valign-helper {
+      display: inline-block;
+      height: 100%;
+      vertical-align: middle;
     }
 
     #site-logo {
diff --git a/app/assets/stylesheets/mobile/header.scss b/app/assets/stylesheets/mobile/header.scss
index f6a027afe08..8f9e0dbf985 100644
--- a/app/assets/stylesheets/mobile/header.scss
+++ b/app/assets/stylesheets/mobile/header.scss
@@ -5,17 +5,17 @@
 .d-header {
 
   #site-logo {
-    max-width: 122px;
+    max-width: 135px;
   }
 
   // some protection for text-only site titles
   .title {
     margin-left: 10px;
-    max-width: 135px;
+    max-width: 140px;
+    height: 39px;
     overflow: hidden;
     padding: 0;
     text-overflow: clip;
-    display: block; // table causes clipping fail oddities here
   }
 
   .icons {