Mobile Device Displaying Incorrectly with Outreach Theme

[310miker]

The top and bottom section of my website look cutoff in mobile devices like iPhones. It looks fine on a computer web browser, but not on mobile devices. The top logo looks like it is all the way to the left and cutoff. The bottom is cut in half and only appears on the left side.

Here is the link: http://ifmasfv.org/

Any ideas on how to fix this?

Also, different issue: I'm using the NextGEN Gallery http://ifmasfv.org/gallery/?album=1&gallery=3, on my browser it looks okay, but the slide show takes forever. However, others using IE have told me that all the thumbnail images look bunched together in one long column and are not displaying correctly. Any tips on how to fix this or should I switch to a different gallery?

[jordy]

My slideshow also seems rather slow, i thought it was just me because of my budget hosting and bad connection speed.
Would love too hear any solution to this asswell.

I do have a solution for you with the thumbnails on IE, i had the same problem on IE8.

The default Genesis css has this in it :

img {
height: auto;
max-width: 100%;
}

So this is applyd too evrey image on your website, unfortantly the NGG thumbnails bugs in IE8 because of this.
I added this too my css and got it fixed it.

.ngg-gallery-thumbnail-box img {
max-width: none;
}

You should place this underneath the default img tag so it wont get overruled.

[jordy]

you can test your website in IE with this btw : http://www.my-debugbar.com/wiki/IETester/HomePage

[Doak Heggeness]

Your website is not mobile responsive. The 'responsive' css at the bottom of the stylesheet has been deleted.

It goes after this....
/* Responsive Design
------------------------------------------------------------ */

---

Doak Heggeness, WordPress Development | Website

[310miker]

Thanks Jordy. That worked. But, for some reason my slideshow won't work, not because of the code change. It actually stopped working a while ago, so I took the link down. Has that ever happened to you?

[310miker]

Hi Doak,

I understand mobile responsiveness. However, my site displays on an iphone and other mobile devices. It is just the header and footer that need to be fixed. I don't need it to scale because it already scales on mobile devices fine. I'm sure there is a way in the code to fix the header and footer so that they display correctly in mobile devices I'm just not sure how.

[jordy]

That has never happend too me, but that can also be because i never use the slideshow function cause in my opinion its not user friendly.
If u could track wich people choose to click themselfs or watch the slideshow im pretty sure about evreyone will click themselfs.

I did just check for you if mine slideshow still works and it does. ( im on Version: 1.9.7 )

But i still think the gallery is rather slow with loading + i think the default layout options are rather poor looking asswell. (might just make one myself)
The one you use is one of the most proper looking ones, but it misses a close button wich maney clients keep asking for.

I do have the "resize on upload activated" and the images are about 700kb each, pretty the same like yours.. think thats normal size?
Woud love too hear any solution for this from any other members?

[Author]

Posts