Title: Making image header scale (responsive)
Last modified: August 30, 2016

---

# Making image header scale (responsive)

 *  [MikevHam](https://wordpress.org/support/users/mikevham/)
 * (@mikevham)
 * [10 years, 5 months ago](https://wordpress.org/support/topic/making-image-header-scale-responsive/)
 * Hi,
 * I would like the image in the header to scale with the resolution the website
   is displayed. My website is [http://tipsentopsvoormama.nl/](http://tipsentopsvoormama.nl/)
 * In this case the image in the header is my logo but when viewing it on mobile
   the logo is too wide for the screen and it doesn’t adjust. I tried to fix this
   with max width but unfortunately it is not working.
 * I hope someone can help me with this!
 * Thanks

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

 *  [awanrmb](https://wordpress.org/support/users/awanrmb/)
 * (@awanrmb)
 * [10 years, 5 months ago](https://wordpress.org/support/topic/making-image-header-scale-responsive/#post-6895951)
 * Hello there,
 * Please try these css code:
 *     ```
       @media screen and (max-width: 991px){
         .has-banner .site-branding {
           padding: 65px;
         }
   
         .site-header:after {
           background-size: contain;
         }
       }
       ```
   
 *  Thread Starter [MikevHam](https://wordpress.org/support/users/mikevham/)
 * (@mikevham)
 * [10 years, 5 months ago](https://wordpress.org/support/topic/making-image-header-scale-responsive/#post-6895959)
 * Hi!
 * Thank you for your answer.
 * I tried this but with contain it also scales the background image up on bigger
   screens. I want the image to keep the original size it is now and only scales
   down. I don’t think this is possible with only css.
 *  [awanrmb](https://wordpress.org/support/users/awanrmb/)
 * (@awanrmb)
 * [10 years, 5 months ago](https://wordpress.org/support/topic/making-image-header-scale-responsive/#post-6895961)
 * Hi,
 * I get the code in above when I am using simulator screen for iphone 6, and its
   working well in here.
 * here is the screenshot [http://prntscr.com/9n132u](http://prntscr.com/9n132u)

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

The topic ‘Making image header scale (responsive)’ is closed to new replies.

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

 * 3 replies
 * 2 participants
 * Last reply from: [awanrmb](https://wordpress.org/support/users/awanrmb/)
 * Last activity: [10 years, 5 months ago](https://wordpress.org/support/topic/making-image-header-scale-responsive/#post-6895961)
 * Status: not resolved