- This topic has 13 replies, 5 voices, and was last updated 5 years ago by Skandha.
-
AuthorPosts
-
November 12, 2018 at 4:01 am #159057ShieldmediaworksParticipant
I have a header image that has a figure on each side of the page and a black centre, when I minimize to view on cellphone the figures disappear and all I’m left with is the black middle, is there a way to have the image shrink appropriately?
November 12, 2018 at 4:50 am #159066sapanaParticipant@shieldmediaworks: Please post in your site Url so that I can look into those issues.
Kind Regards,
SapanaNovember 12, 2018 at 5:15 am #159067ShieldmediaworksParticipantHi Sapana
Thank you for wanting to look into this further, I am creating an adult themed website for my client. If this isn’t an issue for you the website address is http://www.wellingtonretreat.nz
November 13, 2018 at 2:55 am #159143SkandhaParticipant@shieldmediaworks: Go to => Appearance => Customize => Additional CSS and add the following CSS Code.
@media screen and (max-width:797px) { .has-header-image .custom-header-media .wp-custom-header img { object-fit:unset; } }
Let me know if this is what you want.
Kind Regards,
SkandhaNovember 13, 2018 at 6:27 am #159162ShieldmediaworksParticipantWow! This is so close, closer than I have been in days. The images look quite stretched is there a ratio thing happening? do I need to alter the height as well as the width? What would this look like when put in CSS?
Thank you so much for your help, it is greatly appreciated.
November 13, 2018 at 10:53 pm #159218SkandhaParticipant@shieldmediaworks: I don’t think you can do much with the images looking stretched on smaller screens. As the header image you have put has two figure on the right and the left side it will look stretched when you decrease the width of screen in order to adjust with the screen size.
Kind Regards,
SkandhaJanuary 13, 2019 at 8:32 am #163405centresceneParticipantHello,
I would like the header image (1920×1080) of the site I create to be responsive on a tablet and mobile.
How to do this, please?Thank you for advance.
Regards.January 14, 2019 at 1:44 am #163470SkandhaParticipant@centrescene: Please post in your site URL so that I can look into the issue.
Kind Regards,
SkandhaJanuary 25, 2019 at 7:57 am #164404valthtParticipantHiya same thing here… can’t seem to fit the header image in the tablet or mobile view, if you have any idea how to do this, or if I just could upload an alternate header image for tablet/mobile view (in that case, I really need a step by step explanation…)?
have a nice day
http://saamaraproject.com/
ValentineJanuary 28, 2019 at 2:26 am #164537SkandhaParticipant@valtht: Go to => Appearance => Customize => Additional CSS and add the following CSS Code.
@media screen and (max-width:767px) { .has-header-image .custom-header-media .wp-custom-header img, .has-header-video .custom-header-media .wp-custom-header video, .has-header-video .custom-header-media .wp-custom-header iframe { object-fit:fill !important; } }
Let me know if this works out!
Kind Regards,
SkandhaFebruary 22, 2019 at 1:29 pm #166461centresceneParticipantHello,
I’m sorry for my late.
My website is https://lisanttalespectaclemusical.com
Thank you for advance.
Regards.
CentresceneFebruary 25, 2019 at 1:24 am #166612SkandhaParticipant@centrescene: Hello Centrescence,
Go to => Appearance => Customize => Additional CSS and add the following CSS Code..has-header-image .custom-header-media .wp-custom-header img { position:unset !important; }
Let me know if this helps you out!
Kind Regards,
SkandhaFebruary 25, 2019 at 8:40 am #166665centresceneParticipantHello,
Thank you for your answer.
I added this CSS code but the header image has been doubled on the smartphone’s browser.
Do you have an other solution for my header image ?https://lisanttalespectaclemusical.com
Thank you for advance.
CentresceneFebruary 26, 2019 at 2:58 am #166719SkandhaParticipant@centrescene: I checked your site on an android phone and it seems to showing up fine. Can you let me know on which smartphone the header image was appearing very large?
Kind Regards,
Skandha -
AuthorPosts
- The topic ‘Header image not shrinking on mobile’ is closed to new replies.