Hi, here is some clarification after further investigation and what I initially posted was inaccurate. When you first come to the site on a tablet with Android 4.0.x, the header is displayed correctly with the menu and social icons. However, once a visitor scrolls down the page, the sticky header completely disappears and in its place, the Facebook and Twitter text (which do not appear to be links) is displayed on the upper left and overlapping each other as seen from the prior posted screencaps.
This is happening because of a custom css that I have added in an attempt to change the behavior of the display of the social icons. By default with the AppDev theme on any browser, if a user enables the social icons, they display on the header when landing on the site, but are hidden on the sticky header once a user scrolls down the page. Our client wanted to have the social icons stay on the sticky header as a user scrolls down so that those social links are always available. To try to accommodate that, I added the following modified declaration to the Theme Options > Custom CSS to force the social-container to always display:
#header.sticky .social-container {display: block; top: 15px;}
This appeared to work on desktop/laptop screens and tablet-sized screens in landscape mode which was perfect until the reported issue with the client checking with tablets using Browser in Android 4.0.3. Disabling my custom style allows the sticky header to display correctly again. Are there any suggestions for a correct way to force the social icons to display with the sticky header?
Regards,
Frank