Other Browsers, Keyboards, and Height

As a followup to my article on iOS 7's keyboard and height problems, I thought I'd check in with other browsers... and I was left more confused than before. I am using the same demo page as my last article for these other browsers with an element positioned absolute at the bottom. I always thought I knew how this worked, but I was very wrong (or everyone has changed how this worked, and I missed the conversion day). I still need to test what has the potential to be the strangest of all... the stock Android browser (the "IE 6" one).

(Updated November 19, 2013: Screenshots added)

Windows 8 IE 11

The keyboard here appears above the fixed content (as I would hope), and the window and document heights appear unchanged (as I also would hope). I like it.

Windows 8 IE 11 with Keyboard Up

Windows Phone 8 IE 10

Visually, this actually behaves similarly to Windows 8's browser. The document's height stays the same, so the keyboard is on a layer above the footer, as I would expect. It differs from Windows 8, however, in that the window height does actually change. So with the keyboard up, the window height will be effectively the document height less the keyboard's height.

Windows Phone 8 IE 10 with Keyboard Up

Android Chrome (4.3)

I was surprised to see behavior that more closely matches the busted iOS 7 WebView: The fixed footer stays attached to the top of the keyboard. As far as heights are concerned - the document height here is the one that shrinks while the window's stays the same. This is the opposite of the Windows Phone test, and in my head makes less sense.

I will need to rerun this test now that upcoming versions of Chrome will allow homescreen apps, similar to iOS. It should also be noted that the latest Android Firefox (25.0) also pushes up the footer with the keyboard.

iOS Chrome & iOS Twitter App's Browser

Unsurprisingly (when you know that both Chrome and Twitter - and Facebook, Flipboard, etc. - just use a WebView with some different controls than Safari), both of these behave exactly as the busted WebView.

Chrome test on launch Chrome + WebView Issues with Keyboard UpFun with WebViews and Landscapes

I've always hated in-app browsers because they have always been just a poor man's version of the actual Safari browser. Still... they remain in heavy use since they are embedded in some very popular apps (as noted by Luke Wroblewski) and some people falsely believe that iOS Chrome uses its own Chrome-like rendering engine. With iOS 7 these limited browsers become much poorer.