I made my photography website as cross platform as I could without making separate web pages. This is my webpage.
It validates ok in w3c, and works perfectly in Chrome and Firefox for Linux, and in Chrome, Dolphin and the default browser for Android. However, it goes crazy in Firefox for android phones: it zooms in a lot with no reason, and the formatting is totally wrong.
Of course this is a bug in Firefox since it is not consistent between platforms, but which is the culprit? How can this be avoided? I guess there's something that can be done in the big IMG at the beginning of the page to prevent this.
EDIT: Firefox for tablets works fine too.
Related
We have programmed a site at: http://tcsdesignreno.com/zing-cards/ to be responsive. Whenever I check it in online responsive design test sites (such as: http://mattkersley.com/responsive/ or http://beta.screenqueri.es/) it looks fine but if I bring it up on my HTC Sensation, iPhone 5 or a Galaxy 3 it cuts off the right side of the screen. I have used the standard web browsers and chrome on the phones. I am not sure how to check the CSS on my phone to see what the problem is.
Does anyone have any suggestions on either how to fix the site or how to find the error from my phone?
You can debug Android's Chrome Browser from your computer; details at this link.
I am making a mobile site and I have a problem on a Samsung Galaxy s3. The thing is that my chosen font-size looks fine in Chrome, but is too small in the native Android browser.
On the other hand if I increase font size, it is too big on Chrome.
Is there any way to target Android browser, or to alter it's behavior?
visit this page from your android browser: http://whatsmyuseragent.com/
you will get the user agent of your browser and that is an attribute you can differentiate browsers by.
I have developed a web app with jQuery Mobile that works fine in most phones I've tested it on, but recently found out that on SonyEricsson Xperia the pages won't scroll!
Is there anyone here who has come across scrolling problems on any platform with jQuery Mobile apps and knows what causes it and possibly what to do about it?
If I download Opera Mobile browser on the Xperia it works fine, so it only seems to have to do with the default browser (which I don't know what it is, but I assume Google's stock browser...)
I had a similar problem when my JQM web application wouldnt scroll on Xperia.
Firstly I would recommend testing whether you can scroll over content on this page: http://jquerymobile.com/test/docs/lists/lists-performance.html
In my case I could scroll over the content provided via the link above, so I realised it was a local problem. After some research I found out that I had overflow:hidden property attached to my html,body via one of my css files.
I'm trying to see if I can implement a rudimentary external scrollbar for an overflow:scroll box area and everything works on a browser on my computer and Firefox on the tablet, but it doesn't seem to work at all with the stock browser.
Is scrollLeft not supported? Is there any alternative that I can pursue?
Thanks!
Working on a mobile web application, I have found that some Android devices are rendering CSS differently than others. The detail on the site renders perfectly on every desktop browser I have tried on Windows & Mac, on iPhone, on every Android SDK Emulator I have tried, and even BlackBerry. While some Android devices render it perfectly, about half do not - and these "misrender" it in consistent ways. (For example, it looks great in a Galaxy, but is offset when using a G2.)
Aside from purchasing every single Android device on the market, is there any way to test CSS across all the devices available?
Thanks in advance!
In fact: you can use the emulator to replicate CSS differences. I didn't try enough variations.