Cannot set scrollTop for the body element and cannot determinate whether the body has a scroll bar or not.

Confirmed Issue #14721015 • Assigned to travil

Details

Author
Hellen D.
Created
Nov 17, 2017
Privacy
This issue is public.
Found in
  • Microsoft Edge
Found in build #
16.16299
Reports
Reported by 1 person

Sign in to watch or report this issue.

Steps to reproduce

When I try to set scrollTop of the body, it doesn’t lead to real body scrolling, only the document scrolls for several pixels. Also body.scrollHeight is the same as document.scrollHeight and I cannot determinate from code whether the body has a scroll or not.

In IE11 and in all other browsers, body.scrollHeight > document.scrollHeight and I can scroll body by setting body.scrollTop.

I created a simple page to reproduce the problem with scrolling on a page:

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>Page</title>
    <style type="text/css">
        html {
            height: 100%;
            overflow: hidden;
            background-color: coral;
        }

        body {
            height: 100%;
            overflow: scroll;
            background-color: burlywood;
        }
    </style>

</head>
<body>
<div id="blue" style="background-color: #36B6E5; width: 1167px; height: 512px"></div>
</body>
</html>

Attachments

1 attachment

Comments and activity

  • Microsoft Edge Team

    Changed Assigned To to “James M.”

  • Hello,

    Thank you for providing this information about the issue. After thorough testing, we are unable to reproduce this problem in Edge with the information at hand. Please update this case with repro steps on how one can see the problem using your sample code.

    Best Wishes,
    The MS Edge Team

  • To reproduce this problem, please open the example page in a small browser window (e.g. 700x400 size).
    After that, you will be able to obtain document measures in the console:

    document.documentElement.scrollHeight // -> in Edge it's 416, in Chrome (and others) - 416
    
    document.body.scrollHeight // -> in Edge it's again(!) 416, in Chrome (and others) - 512
    

    So, I cannot determine from code whether the body has a scroll or not, because in general case the body has a scroll when its overflow style is auto or scroll and body.scrollHeight > documentElement.scrollHeight.

    And when I try to scroll the body via code, I cannot do this in Edge, but in Chrome and others I can:

    document.body.scrollTop = 400 // -> in Edge this doesn't lead to scroll body, in Chrome and others - it does.
    
  • Microsoft Edge Team

    Changed Assigned To to “travil”

  • Any news?

  • Microsoft Edge Team

    Changed Status to “Confirmed”

You need to sign in to your Microsoft account to add a comment.

Sign in