Title: Why isnt Header image responsive?
Last modified: November 20, 2019

---

# Why isnt Header image responsive?

 *  Resolved [recoil9](https://wordpress.org/support/users/recoil9/)
 * (@recoil9)
 * [6 years, 5 months ago](https://wordpress.org/support/topic/why-isnt-header-image-responsive/)
 * I really liked the design of the suki wordpress theme as shown in the template
   picture so I thought I would download and play around with it. My site is live
   so im just working on the live preview to see how things look and one big issue
   Im facing is My header image is not responsive live most other themes.
 * Why do I have to enter a mobile size header image? With tablets and smart phones
   being in varying sizes wouldnt a responsive desktop header image be the most 
   user friendly choice?
 * Im still learning alot about wordpress and really like this theme but this mobile
   header image issue is really giving me a hard time. and with my site being live
   I cant just leave this theme active and have people see it on mobile device not
   properly sized. Any help with this please?
 * p.s. Would it be nice to have the header image responsive to full width of any
   mobile decive / tablet and have the menu link underneath it?
    -  This topic was modified 6 years, 5 months ago by [recoil9](https://wordpress.org/support/users/recoil9/).

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

 *  Theme Author [sukiwp](https://wordpress.org/support/users/sukiwp/)
 * (@sukiwp)
 * [6 years, 5 months ago](https://wordpress.org/support/topic/why-isnt-header-image-responsive/#post-12158273)
 * Hi [@recoil9](https://wordpress.org/support/users/recoil9/)
 * Thanks for using Suki and we’re really glad that you like it.
 * Can you share the site URL that you are currently working on?
 * Yes, we encourage users to input logo width, both for desktop header logo and
   mobile header logo. There are some reasons why:
 * – Suki supports SVG logo (using SVG for logo is really recommended because of
   its best quality). And specifying the logo width is required in this case. Otherwise
   the SVG logo width would be uncontrolled.
 * – Retina image. People want to have a really sharp logo (because it’s their branding).
   Thus, they will upload the retina version. So let’s say you want the logo to 
   be 100px width, you could upload 200px logo image but set the width option to
   100px. This way, your logo would look sharp on both normal and retina devices.
 * – We want consistency and defining logo width in “px” is the right approach in
   our opinion. If you use “%” or let the logo fluidly resize on smaller browsers,
   that would make your logo looks too small on some devices.
 * Let me know if you still need help with this. It would be better if you can share
   the site URL so we can point out how the solution would be.
 * Regards,
    David
 *  Thread Starter [recoil9](https://wordpress.org/support/users/recoil9/)
 * (@recoil9)
 * [6 years, 5 months ago](https://wordpress.org/support/topic/why-isnt-header-image-responsive/#post-12159449)
 * Ah, thank you David for the quick informative reply. I tried resizing the logo
   for mobile device but if i make it the width of my mobile phone, for example,
   it pushes the three bars for drop down menu off the screen. I also wanted custom
   html so phone number would display at top but that gets pushed off screen as 
   well and doesn’t wrap underneath the logo.???
 *  Thread Starter [recoil9](https://wordpress.org/support/users/recoil9/)
 * (@recoil9)
 * [6 years, 5 months ago](https://wordpress.org/support/topic/why-isnt-header-image-responsive/#post-12160395)
 * Here is a link to explain and show the problem I have with your mobile logo forced
   pixel width. Please see images and explanation. Thank you. [Click Here](http://thengraver.com/TEST/suki-header-problems/)
 *  Theme Author [sukiwp](https://wordpress.org/support/users/sukiwp/)
 * (@sukiwp)
 * [6 years, 5 months ago](https://wordpress.org/support/topic/why-isnt-header-image-responsive/#post-12162297)
 * Hi,
 * So what kind of mobile header layout that you want? Is there any design draft?
   Maybe you can use a bit of custom CSS.
 * The way we organize the layout on desktop header and mobile header is like this:
 * – Each section has a fixed height value (for further implementation, e.g. Sticky
   Header module on our Suki Pro addon).
    – Header elements are put into each different
   column.
 * In your example, you put the logo on left column, and mobile menu toggle on right
   column. It’s expected that the mobile menu toggle will never wrapped down below
   the logo.

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

The topic ‘Why isnt Header image responsive?’ is closed to new replies.

 * ![](https://i0.wp.com/themes.svn.wordpress.org/suki/1.3.7/screenshot.jpg)
 * Suki
 * [Support Threads](https://wordpress.org/support/theme/suki/)
 * [Active Topics](https://wordpress.org/support/theme/suki/active/)
 * [Unresolved Topics](https://wordpress.org/support/theme/suki/unresolved/)
 * [Reviews](https://wordpress.org/support/theme/suki/reviews/)

## Tags

 * [responsive header image](https://wordpress.org/support/topic-tag/responsive-header-image/)

 * 4 replies
 * 2 participants
 * Last reply from: [sukiwp](https://wordpress.org/support/users/sukiwp/)
 * Last activity: [6 years, 5 months ago](https://wordpress.org/support/topic/why-isnt-header-image-responsive/#post-12162297)
 * Status: resolved