Calendar page not showing full width on mobile

Hi grundpup, I don’t actually see a tribe-events.css file when I view your site – do you still need help with this / have you found a different approach?

Barry, thanks so much for reading my question!

You may not see it on my sandbox sites because I am trying out the Time.ly calendar. (I like yours better!!!)

You should see it here at the client’s site, they still have Tri.be installed. https://www.tiferethisraelpa.org/

The trouble is that there’s a 1px background hairline on the right in iPhone, no matter what @media I do.

It’s in the header
‘<link id=”tribe_events-calendar-override-style-css” media=”all” type=”text/css” href=”https://www.tiferethisraelpa.org/wp-content/themes/twentyeleven-child/tribe-events/tribe-events.css?ver=3.6&#8243; rel=”stylesheet”>’

Hmm, for some reason your main events page doesn’t seem to be working as expected, so it’s difficult to assess the problem :-/

You are so right, my client did something to it. Sorry :^(

Okay, I reactivated the Tribe Events here
https://www.downtoearthwebworks.com/sandbox/events/

Try it on an iphone or other mobile and notice the blue 1px line on the right. I’ve tried a number of different @media queries for different widths, but the page always resizes to keep that 1px line visible.

Other WP pages all look good on mobile, no lines.

Thanks.

I can’t actually see this (admittedly I don’t have an iOS device to hand – but with a resized browser, handheld Android and BlackBerry I’m just not seeing it).

As you can understand that makes it rather difficult to help … so, unfortunately, on this occasion I think we’re going to have to bow out and wish you luck.

https://www.downtoearthwebworks.com/iphone3.jpg

This is what it looks like on iphone.

Barry, it’s basically a problem of the #tribe-events-content table.tribe-events-calendar not shrinking to fit the page width on smaller device widths. Any idea what I could try? Is it the type size forcing td’s to a certain size? Maybe could make smaller?

I’m sure this is not an isolated need because we are being expected to design for all devices now. Your calendar is top notch display wise for the most part, heads above Google’s and Timely. All it needs is a tweak here if can be done. Thanks.

Now it looks worse, so I’m on the right track, he he.

Does this help?

https://gist.github.com/afragen/3762892