homepage Welcome to WebmasterWorld Guest from 23.22.29.137
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Mobile Internet / Native Mobile and Tablet Application Design and Development
Forum Library, Charter, Moderator: open

Native Mobile and Tablet Application Design and Development Forum

    
Responsive site misbehaving
brandozz




msg:4635060
 3:28 pm on Jan 4, 2014 (gmt 0)

I've developed a site using bootstrap as my framework, my responsive layout is misbehaving on some tablets and phones.

1. When testing on my Android Galaxy Tab and Kindle the site only fills half the screen.
2. The site loads properly on the iphone in portrait but when rotated to landscape it seems to zoom in and only shows half of the page. The opposite of the Android issue.

I have my meta viewport set as:
<meta name="viewport" content="width=device-width, initial-scale=1.0">

Has anybody else ever experienced these issues? I can't seem to figure out what would be causing the issue. When I test on my desktop in chorme and firefox the layout collapses and expands as expected.

 

adamxcl




msg:4635674
 2:18 am on Jan 7, 2014 (gmt 0)

I have seen what you are describing before. Still see it on man websites. I sometimes would pull my hair out testing different devices. You think you have it working on iPads, phones and computers and then the Nexus doesn't work right. Get it working there and then the iPad doesn't work right. Pretty much everything I have tried over the last two years, you can then find some mobile device that doesn't work right.

I remember when I got the first Google Nexus on the day it came out. Some of their own stuff like Google Maps didn't work right. Then a Chrome version had a major bug for a while on just the Nexus. There is just too much going on now and too many companies going in their own direction.

I was able to spend a couple hours with the head of Safari development team last summer trying to solve a weird problem. After trying everything, we basically determined that Google was doing something just make it mess up on ios devices. When faking the device response to something else, it then worked on the same device.

Just get all the big name devices for testing and make sure it works on all those.

brandozz




msg:4635748
 1:59 pm on Jan 7, 2014 (gmt 0)

Thanks for your feedback. It ended up being a slider that I'm using. I had a div with a very large width inside a container div. I removed the width so as of right now, at least on the devices that I've tested, everything seems to be working.

It is frustrating trying to create a layout that works and is consistent on every device. On my Galaxy Tab 2 I can't seem to get any of my headings to be bold. Not sure why, still investigating.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Mobile Internet / Native Mobile and Tablet Application Design and Development
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved