Title: Header Logo
Last modified: August 21, 2016

---

# Header Logo

 *  Resolved [danmhubb](https://wordpress.org/support/users/danmhubb/)
 * (@danmhubb)
 * [12 years ago](https://wordpress.org/support/topic/header-logo-10/)
 * Is there anyway for the header image to be responsive?

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

 *  Theme Author [simplethemes](https://wordpress.org/support/users/simplethemes/)
 * (@simplethemes)
 * [12 years ago](https://wordpress.org/support/topic/header-logo-10/#post-4838758)
 * Yes, the easiest way is to ensure the maximum width is 320px or less.
    If you
   specify a larger header, then you’ll need some device-specific media queries 
   in your CSS. Without knowing what size your header is, here is a starting point
   with comments to resize the header image based on screen/device size:
 *     ```
       /* Tablet Portrait size to standard 960 */
   
       @media only screen and (min-width: 768px) and (max-width: 959px) {
       	h1#site-title img {
       		max-width: 768px;
       	}
       }
   
       /* All Mobile Sizes (devices and browser) */
       @media only screen and (max-width: 767px) {
       	h1#site-title img {
       		max-width: 320px;
       		margin: 0 auto;
       	}
       }
   
       /* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
       @media only screen and (min-width: 480px) and (max-width: 767px) {
       	h1#site-title img {
       		max-width: 480px;
       	}
       }
       ```
   
 *  Thread Starter [danmhubb](https://wordpress.org/support/users/danmhubb/)
 * (@danmhubb)
 * [12 years ago](https://wordpress.org/support/topic/header-logo-10/#post-4838795)
 * the header image is 940 px x 141 px, but i tried copy and pasting what you sent
   but It didn’t work, is there a certain place to put it in the css file?
 *  [Bill Milhoan](https://wordpress.org/support/users/bill_milhoan/)
 * (@bill_milhoan)
 * [12 years ago](https://wordpress.org/support/topic/header-logo-10/#post-4838817)
 * Hi Dan,
 * Make sure you find the section in your child style.css file that describes changes
   to the page based on media query. If you haven’t changed anything out of the 
   box you should have a line of code that looks like this:
    `@media only screen
   and (min-width: 320px) and (max-width: 480px) {`
 * I pasted the `h1#site-title img` code under there.

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

The topic ‘Header Logo’ is closed to new replies.

 * ![](https://i0.wp.com/themes.svn.wordpress.org/smpl-skeleton/2.1.1/screenshot.
   png)
 * Smpl Skeleton
 * [Support Threads](https://wordpress.org/support/theme/smpl-skeleton/)
 * [Active Topics](https://wordpress.org/support/theme/smpl-skeleton/active/)
 * [Unresolved Topics](https://wordpress.org/support/theme/smpl-skeleton/unresolved/)
 * [Reviews](https://wordpress.org/support/theme/smpl-skeleton/reviews/)

## Tags

 * [logo](https://wordpress.org/support/topic-tag/logo/)

 * 3 replies
 * 3 participants
 * Last reply from: [Bill Milhoan](https://wordpress.org/support/users/bill_milhoan/)
 * Last activity: [12 years ago](https://wordpress.org/support/topic/header-logo-10/#post-4838817)
 * Status: resolved