I'm currently working on a mobile project using HTML/CSS, but I am not utilizing jQuery Mobile.
One issue I've encountered is with the fixed header at the top of the page. On the Samsung Galaxy S3, when there is a lot of content that scrolls off the screen, the header ends up moving to the middle of the screen as I scroll down.
While this behavior occurs on the Samsung Galaxy S3, it works fine on other devices like the iPhone. Here's a snippet of my code:
.headerTop {
z-index: 9;
position: fixed;
width: 100%;
background-color: #fff;
height: 60px;}
Is there a way to fix this issue using CSS alone, or would I need to use jQuery or some other solution?