Mobile/Tablet Compatibility
-
How do I make sure my displayed images scale to the screens of mobile and tablet? When I preview in tablet/mobile mode, the images are cut off?
Thanks.
The blog I need help with is: (visible only to logged in users)
-
What theme is your WordPress.com site https://weightliftingwithoutlimits.com/ using? I can have a look at it and suggest further.
-
-
-
Does anyone know the CSS code to make sure my displyed images (and other images) scale in mobile devices?
-
-
Hi there, can you point us to a page where the image is not resizing? I’ve checked your site and am not seeing any. I did check the Radcliffe 2 demo site and the image do seem to be resizing just fine.
Also, when you respond to your own thread, to try and bump it, it ends up putting you at the bottom of my list of threads that need response since my list is from oldest to newest, and when you respond to bump, it puts you at the bottom (newer date/time)
-
It would be the display image on the home page
On the mobile version I only see the center part of it.
https://weightliftingwithoutlimits.com/
thanks.
-
Hi,
I can not access to your website because it is on private mode.
Please make it public so we can see it.
-
michroniche, please don’t ask the original poster to make their site public. Volunteers ought to respect their privacy.
If you are unsure about an answer during volunteering, leave the thread and let others to take it up. You can also subscribe to the thread if you wish to stay updated on the progress.
Also, note that if a Happiness Engineer is already engaging in the thread, it’s not necessary for the volunteers to jump in. It’s encouraged you read this volunteers guide too to know how we work.
Thank you for contributing!
-
sorry, the website was temporarily private for updating. It is now public.
Yes, it seems that the display images wont scale down on phones/tablets.
-
Hi @weightliftingwithoutlimits, this is tricky since the theme software continually calculates the height of that div based on the width of the viewport, and it isn’t designed to keep the entire image visible at all screen sizes, but to have the image cover the entire area allotted to it. This is about the best I can do. First off, remove these two CSS rules from your custom CSS.
.page .entry-thumbnail { max-height:600px } .page .entry-thumbnail { max-width:100% }Then add this one and see what you think.
.page .entry-thumbnail { background-size: contain; background-repeat: no-repeat; background-position: center top; height: calc(100vw * 0.40) !important; min-height: 100% !important; } -
-
Steve, I’m going to mark this as resolved, but if you need additional help on this issue, feel free to post back here in this thread and we will be happy to help.
- The topic ‘Mobile/Tablet Compatibility’ is closed to new replies.