Skip to content

Instantly share code, notes, and snippets.

@timwis

timwis/ratchetscrollfix.css

Created January 8, 2013 19:20
Show Gist options
  • Star 1 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save timwis/4487023 to your computer and use it in GitHub Desktop.
Save timwis/4487023 to your computer and use it in GitHub Desktop.
Download ZIP
Ratchet/junior leverages `-webkit-overflow-scrolling` but seems to have a bug on Safari Mobile when you drag the header and then try to scroll the body. This CSS reverts to standard scrolling with a fixed-position header.
Raw
ratchetscrollfix.css
/* Fix scrolling */
body, .content, #app-container { position: static; } /* #app-container is for junior */
.content { -webkit-overflow-scrolling: auto; }
header + .content { padding-top: 44px; }
header + .content-padded { padding-top: 55px; }
.bar-title .title + [class*="button"]:last-child { top: 5px; } /* From ratchet.css, overridden by junior.css */
@aetherwu
Copy link

aetherwu commented Mar 4, 2016

It works like magic !!!!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment