Browser issue Default XF2 style css inconsistencies on Android KitKat default browser

marquisite

Well-known member
Affected version
2.0 (DP10)
On an Android KitKat 4.4.2 phone (Samsung branded with TouchWiz stock firmware) using the default browser, certain parts of the default XF2 theme don't render quite right. The inconsistencies I think are not game breaking, but they do detract from the feel of XenForo 2.0. Having said this, I do accept that KitKat is an older Android version and its popularity is on the decline as people upgrade to newer phones or choose to flash more current third-party firmware.

The default browser application is Internet 1.6.28 1628.
The user agent is reported as Mozilla/5.0 AppleWebKit/537.36 (KHTML, like Gecko) Version/1.6 Chrome/28.0.1500.94 Mobile Safari/537.36.

The attached screenshots compare against Android 4.4.2 and Android 6.0.1's default Internet browser app on identical Samsung phone models.

Xenforo-2-Default-Theme-Android-KitKat-NotableMembers.webp
 

Attachments

  • Xenforo-2-Default-Theme-Android-KitKat-ResponsiveNavigation.webp
    Xenforo-2-Default-Theme-Android-KitKat-ResponsiveNavigation.webp
    19.8 KB · Views: 10
  • Xenforo-2-Default-Theme-Android-KitKat-LatestActivity.webp
    Xenforo-2-Default-Theme-Android-KitKat-LatestActivity.webp
    46.4 KB · Views: 10
  • Xenforo-2-Default-Theme-Android-KitKat-ForumThread.webp
    Xenforo-2-Default-Theme-Android-KitKat-ForumThread.webp
    47.5 KB · Views: 12
I think these things are basically due to it being a comparatively old browser.

The UA string suggests it’s equvialent to Chrome 28 which is getting on for 4 and a half years old now.

The main issue is that the browser doesn’t support Flexbox which is our primary approach to laying out Elements on the page. The fallback approach when that is not available (essentially table layout) is kicking in and so primarily this is as expected.

I’m not sure there’s much more we can do other than recommend a newer browser if possible.

However, we’ll leave this report open in case there’s any specific improvements we can make though I would say that these browser versions are not really something we’re targeting support for.
 
Thanks for the (quick) reply. :)

Yes, I understand your position and to be honest if the default browser wasn't, well, the default for this particular Android release I wouldn't have bothered to report it given its age.

I had thought Flexbox support might have been the issue, although http://caniuse.com/flexbox suggests Chrome versions from 21 to 28 still support this provided that the -webkit prefix is used.
 
Thanks for the (quick) reply. :)

Yes, I understand your position and to be honest if the default browser wasn't, well, the default for this particular Android release I wouldn't have bothered to report it given its age.

I had thought Flexbox support might have been the issue, although http://caniuse.com/flexbox suggests Chrome versions from 21 to 28 still support this provided that the -webkit prefix is used.
It's been already reported. XenForo 2 does not support vendor prefixed flexbox.
 
It's been already reported. XenForo 2 does not support vendor prefixed flexbox.

Thanks, I just located your topic on the XF2 demo site. Since XF2 uses Less for CSS, could the (lack of) vendor prefixes be solved with mixins? A quick google reveals a few git repositories but I can't vouch for their appropriateness in XF2 (or in general) since I haven't used either of them. It just seems a shame to not extend browser support if all it boils down to is a vendor prefix.
 
Top Bottom