My site is not mobile friendly anymore

nancycasanova · Member · Dec 18, 2015 at 4:23 am
Copy link

Add topic to favorites
When I go to my blog from a mobile device, it seems to have an issue with showing it in mobile view. It jumps and then makes it have this white space on the right on a mobile device. What do I do?

The blog I need help with is: (visible only to logged in users)
gugaalveswp · Member · Dec 18, 2015 at 4:43 am
Copy link
Hi there,

I’m testing here and seems to be ok on Android, iOS, and emulating in my pc.. can you send us a screenshot ? So we can test and see how it’s working in your device.
nancycasanova · Member · Dec 18, 2015 at 5:22 am
Copy link
I’m viewing this on my iphone. When I first log on, it shows up mobile friendly and then jumps to having a white/gray space on the right side. It didn’t do that before. If I click into the article, it goes away; however, when you first come to NancyCasanova.com it doesn’t show up as mobile friendly. I’ll email a photo.
nancycasanova · Member · Dec 18, 2015 at 5:24 am
Copy link
Actually, where should i send my screenshot?
justjennifer · Member · Dec 18, 2015 at 5:34 am
Copy link
You can upload it to your site’s Media Library or any image hosting service and then link to it here.
mishrashutosh · Member · Dec 18, 2015 at 5:34 am
Copy link
Hi Nancy,

You can upload your screenshot to http://snag.gy and share the URL here.
nancycasanova · Member · Dec 18, 2015 at 5:43 am
Copy link
Oh thanks. Here’s what I’m seeing: http://snag.gy/D6Wy6.jpg
mishrashutosh · Member · Dec 18, 2015 at 12:36 pm
Copy link
I am not really sure what’s causing this. Usually an overflowing page element results in this layout, but then it should consistently happen across all mobile browsers (your website renders fine on my Android phone). If you’re using an ad/content blocker on iOS, it might be causing this.

Hopefully someone with better knowledge of CSS will help you out. :)
nancycasanova · Member · Dec 18, 2015 at 3:32 pm
Copy link
Someone got back to me and it appears to be embedded tweets that are causing the problem. I just tried updating it with this CSS, but it didn’t work. https://kovshenin.com/2012/quick-tip-how-to-make-tweet-embeds-responsive/
mishrashutosh · Member · Dec 18, 2015 at 3:57 pm
Copy link
Not sure that’s the case because I checked on my phone, and the embedded tweets are responsive, even on my phone’s thinner and smaller display. https://goo.gl/photos/Y32miQtwheVCXsTq8

I’d suggest you add the “modlook” tag to this post so that a staff member or moderator can help sort this out.
nancycasanova · Member · Dec 18, 2015 at 4:03 pm
Copy link
Thanks. I have a blog post with embedded tweets and it looks like it’s causing a grey space on mobile view. Here’s the blog post: http://nancycasanova.com/2015/02/08/how-to-format-your-tweets-for-engagement/

When I entered this CSS: https://kovshenin.com/2012/quick-tip-how-to-make-tweet-embeds-responsive/ It didn’t work.

Here’s a screenshot of what it looks like: http://snag.gy/yv20x.jpg
shawnajroberts · Member · Dec 18, 2015 at 9:07 pm
Copy link
I just pulled your site up on my Android and there isn’t any side scrolling for me.

Is this still happening for you? Can you tell me what version of iOS your phone is running so I can find another Happiness Engineer with that device to test on?
nancycasanova · Member · Dec 18, 2015 at 9:45 pm
Copy link
Hello there. I just tried entering this on my CSS and it didn’t work.

.entry-content .twitter-tweet-rendered {
max-width: 100% !important;
}

I also cleared my browsing history on my phone. I’m still seeing the same thing. I’m using an iPhone iOS 9.2
nancycasanova · Member · Dec 18, 2015 at 9:49 pm
Copy link
Here are the screenshots of what I see after:

http://snag.gy/9fW3i.jpg
shawnajroberts · Member · Dec 18, 2015 at 10:12 pm
Copy link
It looks like you’re working with a couple of Happiness Engineers who have iPhones via email, so I’m going to let them keep working with you. :)

No items found.