Title: Site Title
Last modified: September 29, 2020

---

# Site Title

 *  Resolved [jxnxthxn](https://wordpress.org/support/users/jxnxthxn/)
 * (@jxnxthxn)
 * [5 years, 9 months ago](https://wordpress.org/support/topic/site-title-58/)
 * I’m trying to center my title “BASIS BUGLE” in the middle of the page to the 
   right of my logo. How do I make it so that it shows up properly on desktop, tablet,
   and phone view? Any ideas on the css?
    -  This topic was modified 5 years, 9 months ago by [Steven Stern (sterndata)](https://wordpress.org/support/users/sterndata/).
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fsite-title-58%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 4 replies - 1 through 4 (of 4 total)

 *  [Niall Madhoo](https://wordpress.org/support/users/nm1com/)
 * (@nm1com)
 * [5 years, 9 months ago](https://wordpress.org/support/topic/site-title-58/#post-13471204)
 * Hello [@jxnxthxn](https://wordpress.org/support/users/jxnxthxn/),
 * Could you please **add** the following **CSS code** in the **Appearance > Customize
   > Additional CSS** section of your **WordPress Admin dashboard**:
 *     ```
       /* --- Begin site branding alignment --- */
       .mb-container {
           position: relative;
       }
   
       .site-branding {
           display: inline-block;   
       }
   
       .site-branding img {
           margin-top: 15px;
       }
   
       .site-title-wrapper {
           display: inline-block;
       }
   
       .site-title {
           font-size: 110px!important;
           display: inline-block;
           text-align: center;
           margin: 0!important;
           position: absolute!important;
           top: 50%!important;
           left: 50%!important;
           transform: translate(-50%, -50%)!important;
           width: 100%;
       }
   
       @media ( max-width: 991.98px ) {
           .site-branding img {
               margin-top: 15px;
               max-height: 60px;
           }
           .site-title {
               font-size: 66px!important;
           }
       }
   
       @media (max-width: 575.98px) { 
           .site-branding img {
               max-height: 33px!important;
           }
           .site-title {
               font-size: 33px!important;
           }
       }
       /* --- End site branding alignment --- */
       ```
   
 * That should keep the **logo** to the **left** with the **text** **centered** 
   in the **header** and to **right** of the **logo**. This **branding** will **
   adjust** for desktops, tablets, and mobiles.
 *  Thread Starter [jxnxthxn](https://wordpress.org/support/users/jxnxthxn/)
 * (@jxnxthxn)
 * [5 years, 9 months ago](https://wordpress.org/support/topic/site-title-58/#post-13471227)
 * Hi [@nm1com](https://wordpress.org/support/users/nm1com/),
 * Thank you so much! It works perfectly:)
 *  [Niall Madhoo](https://wordpress.org/support/users/nm1com/)
 * (@nm1com)
 * [5 years, 9 months ago](https://wordpress.org/support/topic/site-title-58/#post-13475818)
 * You’re welcome, [@jxnxthxn](https://wordpress.org/support/users/jxnxthxn/)! Glad
   it works!
 *  [Niall Madhoo](https://wordpress.org/support/users/nm1com/)
 * (@nm1com)
 * [5 years, 9 months ago](https://wordpress.org/support/topic/site-title-58/#post-13475851)
 * If anyone needs it, I also have the **CSS code** for **aligning** the **logo 
   AND text title** in the **center** of the header:
 *     ```
       /* --- Begin site branding center alignment --- */
       .site-branding {
           float: none;
           display: flex;
           align-items: center;
           justify-content: center;
       }
   
       .site-title-wrapper {
           margin: 0px;
           padding: 0;
       }
   
       .site-title {
           position: relative!important;
           top: auto!important;
           left: auto!important;
           right: auto!important;
           line-height: 110px!important;
           font-size: 110px!important;
       }
   
       .site-title img {
           line-height: 110px;
       }
   
       @media ( max-width: 767.98px ) {
           .site-branding img {
               max-height: 60px;
           }
           .site-title {
               font-size: 33px!important;
           }
       }
       /* --- End site branding center alignment --- */
       ```
   
 * I misunderstood the question and thought it was about **centering** the **entire**
   site branding, rather than **just** the text. 🙂

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Site Title’ is closed to new replies.

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 4 replies
 * 3 participants
 * Last reply from: [Niall Madhoo](https://wordpress.org/support/users/nm1com/)
 * Last activity: [5 years, 9 months ago](https://wordpress.org/support/topic/site-title-58/#post-13475851)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics