Title: Responsive logo
Last modified: August 22, 2016

---

# Responsive logo

 *  Resolved [jd1982](https://wordpress.org/support/users/jd1982/)
 * (@jd1982)
 * [11 years, 4 months ago](https://wordpress.org/support/topic/responsive-logo-1/)
 * Hi Ben et al,
 * I’ve just added a very basic logo that I created to the top of my site [http://jamesdevonshire.com](http://jamesdevonshire.com)
   but I’ve just checked it using my smartphone and the logo doesn’t appear correctly.
 * Any suggestions for making it truly ‘responsive’?
 * Many thanks in advance,
    James

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

 *  [Amin – WPMU DEV Support](https://wordpress.org/support/users/wpmudev-support2/)
 * (@wpmudev-support2)
 * [11 years, 4 months ago](https://wordpress.org/support/topic/responsive-logo-1/#post-5684956)
 * Hey there James,
 * Hope you’re well! 🙂
 * Where do you reside in Philippines? 🙂 by the way, I suggest you use a child 
   theme [http://codex.wordpress.org/Child_Themes](http://codex.wordpress.org/Child_Themes)
   or use css custom plugin like this: [https://wordpress.org/plugins/simple-custom-css/](https://wordpress.org/plugins/simple-custom-css/)
   if you will customize your theme.
 * Add the codein your child theme’s style.css or using the plugin mentioned above.
 *     ```
       #site-header img.logo {
           max-width: 100%!important;
           position: static;
           max-height: auto;
       }
       ```
   
 * This will simply override the default style that comes from the theme. Let me
   know what you think.
 * Looking forward for your reply! 🙂
 * Take care,
    Calvin
 *  Thread Starter [jd1982](https://wordpress.org/support/users/jd1982/)
 * (@jd1982)
 * [11 years, 4 months ago](https://wordpress.org/support/topic/responsive-logo-1/#post-5684966)
 * Hi Calvin,
 * Thanks for the swift reply – much appreciated!
 * I live on the island of Mindoro here.
 * I’ve added the custom CSS as you suggested but it doesn’t appear to have fixed
   the issue when viewing my site on a mobile device.
 * Have I missed something?
 * Thanks in advance,
    James
 *  Theme Author [Ben Sibley](https://wordpress.org/support/users/bensibley/)
 * (@bensibley)
 * [11 years, 4 months ago](https://wordpress.org/support/topic/responsive-logo-1/#post-5685044)
 * Hi James,
 * Looks like we’ll have to hard code in the size for the logo at mobile widths.
   Here is the complete CSS you can use:
 *     ```
       @media all and (max-width: 800px) {
   
         #logo {
           width: 240px !important;
           position: static !important;
         }
       }
       ```
   
 * That will keep the logo 240px wide until the screen is 800px or wider. It’s not
   completely fluid, but it will keep the logo looking nice across devices.
 *  Thread Starter [jd1982](https://wordpress.org/support/users/jd1982/)
 * (@jd1982)
 * [11 years, 4 months ago](https://wordpress.org/support/topic/responsive-logo-1/#post-5685107)
 * Hi Ben,
 * Thanks for the quick reply.
 * Okay, I tried the CSS you suggested but it totally broke my site lol. Don’t ask
   me why or how, but after I added that CSS I couldn’t load my site at all. I’ve
   removed it again and the site is back online????
 *  Theme Author [Ben Sibley](https://wordpress.org/support/users/bensibley/)
 * (@bensibley)
 * [11 years, 4 months ago](https://wordpress.org/support/topic/responsive-logo-1/#post-5685111)
 * Oh I’m sorry that happened! I just re-tested the code and it’s working, so there
   must be something else related to the error.
 * Calvin suggested a plugin for adding the CSS, but there is a Custom CSS section
   included in the Customizer with Ignite. Did you use the input in the Customizer
   or the plugin for adding the CSS?
 *  [Amin – WPMU DEV Support](https://wordpress.org/support/users/wpmudev-support2/)
 * (@wpmudev-support2)
 * [11 years, 4 months ago](https://wordpress.org/support/topic/responsive-logo-1/#post-5685120)
 * Hello guys,
 * Hope you guys are well! 🙂
 * [@jd1982](https://wordpress.org/support/users/jd1982/)
 * Before adding the code provided by Ben I suggest you remove the code I provided
   to avoid problem or different result. 🙂
 * [@ben](https://wordpress.org/support/users/ben/)
 * Sorry about that, next time I will recommend using the Custom CSS Section rather
   than the plugin when applicable. 🙂
 * Best Regards,
    Calvin
 *  Theme Author [Ben Sibley](https://wordpress.org/support/users/bensibley/)
 * (@bensibley)
 * [11 years, 4 months ago](https://wordpress.org/support/topic/responsive-logo-1/#post-5685162)
 * [@calvin](https://wordpress.org/support/users/calvin/) No worries, thanks for
   helping out 🙂
 *  Thread Starter [jd1982](https://wordpress.org/support/users/jd1982/)
 * (@jd1982)
 * [11 years, 4 months ago](https://wordpress.org/support/topic/responsive-logo-1/#post-5685190)
 * Hi guys,
 * Okay, so I’ve added the code as you suggested Ben and it hasn’t broken my site
   this time. No idea what happened last time lol.
 * However, I have just viewed my site again on my smartphone and the logo is still
   the same i.e. cut off and not ‘responsive’ – any ideas?
 * Thanks in advance,
    James
 *  Theme Author [Ben Sibley](https://wordpress.org/support/users/bensibley/)
 * (@bensibley)
 * [11 years, 4 months ago](https://wordpress.org/support/topic/responsive-logo-1/#post-5685191)
 * James,
 * I checked your site on a few browsers and I’m seeing the code implemented properly:
   [http://cl.ly/image/2a331W0E070h](http://cl.ly/image/2a331W0E070h).
 * This is good news. It means that the your site is likely just cached on your 
   phone’s browser. You should be able to restart the browser or use a setting to
   clear the cache, and then it should display properly.
 * If this is not the case, please let me know the OS, browser, and browser version
   you’re using on your phone.
 *  Thread Starter [jd1982](https://wordpress.org/support/users/jd1982/)
 * (@jd1982)
 * [11 years, 4 months ago](https://wordpress.org/support/topic/responsive-logo-1/#post-5685192)
 * Hi Ben,
 * It’s now working on my phone too! Bizarre that when I checked after implementation
   earlier it wasn’t and that was after deleting cookies, clearing cache etc.
 * Anyway, thanks very much for your help 🙂
 *  Theme Author [Ben Sibley](https://wordpress.org/support/users/bensibley/)
 * (@bensibley)
 * [11 years, 4 months ago](https://wordpress.org/support/topic/responsive-logo-1/#post-5685214)
 * You’re welcome, glad it’s working now 🙂

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

The topic ‘Responsive logo’ is closed to new replies.

 * ![](https://i0.wp.com/themes.svn.wordpress.org/ignite/1.84/screenshot.png)
 * Ignite
 * [Support Threads](https://wordpress.org/support/theme/ignite/)
 * [Active Topics](https://wordpress.org/support/theme/ignite/active/)
 * [Unresolved Topics](https://wordpress.org/support/theme/ignite/unresolved/)
 * [Reviews](https://wordpress.org/support/theme/ignite/reviews/)

 * 11 replies
 * 3 participants
 * Last reply from: [Ben Sibley](https://wordpress.org/support/users/bensibley/)
 * Last activity: [11 years, 4 months ago](https://wordpress.org/support/topic/responsive-logo-1/#post-5685214)
 * Status: resolved