I've got an issue that I'm trying to get to the bottom of and I can't seem to find an appropriate answer. Our mobile website - currently in test - uses a 3D Secure iframe.
Our tests have confirmed that where the iframe displays properly when using an Android phone (in-built webkit-based browser, Samsung Galaxy S II), it unfortunately does not for an iPhone (again, in-build webkit-based browser, Apple iPhone 4S). The iPhone simply does not display the iframe. I'm uncertain whether the iframe won't show or if it is merely positioned off-screen (but there are no CSS properties applied to either the iframe or parent that would affect its position/float/margins/padding).
Is there a major difference between two webkit-based browsers on different phones which would account for this? Has anyone suffered from the same issue? And if you can help, how do I try to solve it?
<iframe id="authenticationFrame" name="authenticationFrame" src="3d-secure-bit" height="400" width="330"></iframe>
Thanks,
Related
I created a web application dashboard which looks totally fine on the browser on the pc. Now what I would like to do is show this application 24/7 on a Sony Android tv with model number (BRAVIA 2017, android v. 7.0 kernel version 3.10.79).
Chrome natively isn't supported so I tried installing it using an APK. The thing is it the application doesn't look good due to the fact that this browser has a window width of about a 1000px and a height of 417 pixels. I tried downscaling in Chrome settings on the tv but it doesnt work.
Does anyone have any suggestions on what I could try or what other browsers are supported with a nice viewport width and height?
The native build in browser does not support css-grid
EDIT:
The default browser is called Vewd
It's a fact that some browsers ignore CSS they don't understand. If a browser which does not support CSS Grid comes across something it doesn't know, it throws that line away and continues.
Maybe you can use some old CSS like float,
or something to provide a grid type of layout, like
display: table-cell :)
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.
My personnal website is all messed up when i display it on Android devices.
I've tested my site on all major browsers on Windows and Mac OS X:
- IE7 to IE10
- Chrome
- FireFox
- Opera
- Safari
And they all display my website correctly.
I've also tested on some Apple devices and they also display correctly.
But I've tried on a Nexus 4 and a Nexus 7 and the layout is all messed up.
The page is all zoomed out and the menu seems to be outside the viewport.
I'm lost here and any help would be appreciated.
http://www.narcissusphoto.com/
You need to add media queries in your css to look your website for mobile devices. Please refer the below link and accordingly you need to make changes in css.
http://webdesignerwall.com/tutorials/responsive-design-in-3-steps
Try removing the fixed background on the body element.
I have a specific problem that leads me to a general question.
My specific problem is that a css style that I have written,
[data-role='collapsible'] > :first-child .ui-btn-inner
works fine in a pc browser, but not on my android 2.3.
Since I have not figured out how to debug android sites (like firebug for FF), I cannot look at the android-rendered page to see if maybe the jqm framework did something different to data-role='collapsible' on the android.
So my question: does the jqm framework treat pages differently depending on the device?
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.