Archived

This topic is now archived and is closed to further replies.

  • 0

Some of my sites look weird on iPad

Question

Posted · Report post

I have noticed that some of my sites does not look good on iPad. The site is larger than the window it selfs. I thought at first that this only was on one site. But now it seems to be on more Pageline sites. This is only on the first page. Any idea of what could be wrong.

These are incorrect

Http://cherryroad.se

Http://pehjaproduktion.se

Http://hudohalsa.com

Thanks for any feedback!

Share this post


Link to post
Share on other sites

11 answers to this question

Posted · Report post

I managed to fix the layout problem on the iPad with this on http://pehjaproduktion.se 

 

#site .content, #footer .content {

width: auto !important;
}

 

No the rest remains to be figured out..

Share this post


Link to post
Share on other sites

Posted · Report post

Hi Peter,

 

Different browser, in this case, mobile browsers, will render CSS in unique ways, or not recognize it at all.  For example, IE8 and 9 won't recognize WordPress' image scaling and resizing.  If you put a 300px wide image into a post and scaled it to 150px via the Media Library's tools, Internet Explorer will show it as 300px. Often this breaks a site.

 

In Responsive mode, images can break it, custom code set in px instead of % or em will also break it.  These things are fixed width which is never responsive.

 

We offer the Browser Specific CSS plugin which allows you to craft custom CSS for particular browsers like iOS.  This should help

Share this post


Link to post
Share on other sites

Posted · Report post

Hi, What is the layout for these sites? Also, disable all non-PageLines plugins, remove your custom CSS/Code, as when I view a vanilla PageLines Framework, it works on all devices perfectly.

Share this post


Link to post
Share on other sites

Posted · Report post

Thanks Rob. I think Catrina pointed me in that direction (in another session). She also provided with a link to a tutorial that actually made sense. The one provided with the plug really doesn't say anything, therefor useless. I have misplaced the link she gave me... 

 

The site http://pehjaproduktion.se looks alright now. Only thing is the slider that has a gap on the right side, when viewing on the iPad, witch it shouldn't. The author of that plug stated this

 

 "You have the following style added inside your compiled-css-1359229857.css : 12008

site .content, #footer .content {

width: 1028px; } Remove this and you should be fine...

 

Catrina then provided me with this "site .content, #footer .content {}" However that did not work either. Then she pointed me in the same direction as you just did. I will find the link and dig into that. Surly there must be a fix for this.

 

Thanks Peter

Share this post


Link to post
Share on other sites

Posted · Report post

What do you mean with "when I view a vanilla PageLines Framework, it works on all devices perfectly"

Share this post


Link to post
Share on other sites

Posted · Report post

Hm, well yes i Know that PageLine works perfectly without any plugs. I was not aiming to criticize your Framework. I was looking for help!

I have compared the sites with other sites I have built with your framework that works perfectly and could not se any deviations.

So thats why I posted this question here.

 

The layout is Static with pixel width and fixed with mode.   

Share this post


Link to post
Share on other sites

Posted · Report post

The Layout option static with pixel width and Fixed mode are both static and fixed, meaning that they're not responsive, so the width of your site is always the same regardless of device. So you need to use one of the responsive layout options if you wish for your site to look the same on all devices regardless of size.

Share this post


Link to post
Share on other sites

Posted · Report post

Hi Pehja. Is this topic now resolved or do you still need assistance?

Share this post


Link to post
Share on other sites

Posted · Report post

No thats not what I want. I don't understand why only the frontpage is of. All the other pages looks great. And I have the same setting for most of my sites. I do not want the site to be responsive. That really looks crazy. Well I will figure tis out some how.

Even if it means disabling all plugs and custom css wich is really not a good thing to do with my clients sites.

Share this post


Link to post
Share on other sites

Posted · Report post

I still have issues with a few sites looking bad on iPad. But you can close it. I don't think we will get any further here anyway.

Since there aren't anything wrong with PageLines framework I have to look elsewhere.

 

Thanks for asking ;-) 

1 person likes this

Share this post


Link to post
Share on other sites