CODEWITHSUNDEEP
javascripthtmlcsswebkit
Gajus
Gajus

Reputation: 73808

CSS webkit overflow hidden and HTML element height

http://dev.anuary.com/1f1715ac-ad96-536a-a462-74381c7a2baf/test.html http://dev.anuary.com/1f1715ac-ad96-536a-a462-74381c7a2baf/test2.html

test2.html is the expected behaviour. However, it does not implement test.html CSS body {overflow: hidden;}. The latter is needed to prevent WekKit from overscrolling.

Essentially, I need a page with WebKit overscrolling disabled, with an element in DOM width and height 100% (100% meaning window size) and overflow-y: scroll. The only workaround that I managed to figure out is to use JavaScript to give fixed height to the or the wrapping element. Though, preferably I am looking for a solution that doesn't involve JS.

Upvotes: 1

Views: 2636

Answers (1)

ThinkingStiff
ThinkingStiff

Reputation: 65341

You need to set height: 100%; on html and body otherwise they will be much larger than the visible window size.

Demo: http://jsfiddle.net/ThinkingStiff/8ejtP/

html, body {
    height: 100%;
}

Upvotes: 1

Related Questions