Mobile view responsive, but not formatting properly « Support Forum | Kriesi.at - Wordpress Themes and HTML Templates

Kriesi.at - Wordpress Themes and HTML Templates

Support Forum » Incarnation

resolved

Mobile view responsive, but not formatting properly

12 posts from 3 voices

Started 4 months ago by matthewkoster
Latest reply from Nick
This topic is resolved

Tags:

No tags yet.

matthewkoster
Member

I tested out the responsive theme on my Samsung Galaxy Nexus using the default web browser. The front page comes out nice and clean except for the test area with the button, the button seems to come out in the centre, over the text, instead of at the end after the text. Other pages seem to disappear, by this I mean you see the footer and the header, but no content, upon refresh the content shows for a spit second then gets hidden by the background image, which is set to a fixed position.

Is there a way to include screen caps?

Posted 4 months ago #
Ismael
Moderator

Hi,

You can upload it on dropbox or use http://tinypic.com/ then place the link here. Let me tag this among the support team.

Regards,
Ismael

Posted 4 months ago #
Nick
Moderator

Hi,

Please also include the version of Android you are using and browser version if possible.

Thanks,

Nick

Posted 4 months ago #
matthewkoster
Member

Here are the screen shots:
http://tinypic.com/r/kcedud/6 (layout is fine)
http://tinypic.com/r/10fanfq/6 (this is where the button overlaps)
http://tinypic.com/r/2rr40aw/6 (layout is fine)
http://tinypic.com/r/wv39qd/6 (header is fine, footer is fine, but everything else is covered by the background image)

I am using Android 4.1 JB and latest default browser (always keep my apps up to date)

Posted 4 months ago #
Nick
Moderator

Hi,

Thank you. We can see the issue and now we just need to compare the code on the two pages that include all your customization to see where the difference lies. There are too many posibilities for us to correctly guess at the cause without frustrating you with useless fixes. If you are unable to provide a url, please point out pages on the theme demo website that exhibit the same behavior.

http://www.kriesi.at/themes/incarnation/

Thanks,

Nick

Posted 4 months ago #
matthewkoster
Member

for what ever reason I cannot seem to replicate it on the demo site, All the info appears on top of the background image. And the button on the front page appears as it should.

Our site is http//test.atwaterlibrary.ca

Posted 4 months ago #
matthewkoster
Member

http://test.atwaterlibrary.ca

Posted 4 months ago #
Nick
Moderator
Hi,

Ok I can see the problem with Chrome if you make your browser window as small as a smart phone. The reason for this happening are the media queries which ensure that the various screen sizes will see the page styled as appropriate. The button has a general rule from width 767 pixls and less and is not told what to do when the screen size is iphone and smaller. So it kind of sits around unsure what to do.
```
@media only screen and (max-width: 479px){
.responsive #top.home .big_button {
position: absolute;
top: 185px;
}}
```
Please add the block of code above to the bottom of your custom.css or to the Quick CSS located inside the admin section Incarnation > Theme Option > Styles ... The text area at the bottom of the page.

Thanks,
Nick
Posted 4 months ago #
matthewkoster
Member

Ok, close, not quite after the text, but better.
http://tinypic.com/r/9695z8/6

Still having issues with pages not showing up though.... The front oage shouws up OK, but the pages inside come out blank except for the background (In android default borwser)

Downloading Chrome to my pgone to test if it works

Posted 4 months ago #
matthewkoster
Member

Ok, Chrome works like a charm, so the default browser is the culprit, problem is most android users use the default. I can get away with demoing it under Chrome for now, hope my boss' Black Berry can see it ok.

Posted 4 months ago #
matthewkoster
Member

Ok, I buggered up the button again, but its in my code so I will fix it later. The problem with the other pages not showing up had to do with the background setting. If I make the background fixed, the default android browser goes nuts, but if I make is scrollable, its ok. So I have made it scrollable for now.

Posted 4 months ago #
Nick
Moderator

Hi,

That's the problem with responsive design, there are just too many mobile OS variations each with their own quirks. Within a year things should be more standardized.

Thanks,

Nick

Posted 4 months ago #

RSS feed for this topic

Reply

You must log in to post.

© Copyright Kriesi.at – Wordpress Themes and HTML Templates

top