Attachment 373030 Details for Bug 199222 – test with more nested scrollers

test with more nested scrollers

non-nested-scroll-2.html (text/html), 995 bytes, created by Antti Koivisto on 2019-06-27 06:43:18 PDT

(hide)

Description:

Filename:

MIME Type:

Creator: Antti Koivisto

Created: 2019-06-27 06:43:18 PDT

Size: 995 bytes

patch

obsolete

><style>
>#outerouter {
>    overflow-x: scroll;
>    overflow-y: scroll;
>    width: 600px;
>    height: 600px;
>    border: 2px solid purple;
>}
>#outer {
>    overflow-x: hidden;
>    overflow-y: scroll;
>    width: 400px;
>    height: 400px;
>    border: 2px solid yellow;
>}
>#inner {
>    position: relative;
>    overflow-x: scroll;
>    overflow-y: hidden;
>    width: 400px;
>    height: 500px;
>    border: 2px solid blue;
>}
>#innercontent {
>    width: 1000px;
>    height: 1000px;
>    border: 10px solid green;
>}
>#outercontent {
>    width: 1000px;
>    height: 600px;
>    border: 10px solid red;
>}
>#outeroutercontent {
>    width: 1000px;
>    height: 1000px;
>    border: 10px solid blue;
>}
></style>
><div id=outerouter>
>    <div id=outeroutercontent>
>        <div id=outer>
>            <div id=outercontent class=content>
>                Vertical
>                <div id=inner>
>                    <div id=innercontent>Horizontal</div>
>                </div>
>            </div>
>        </div>
>    </div>
></div>

<style>
#outerouter {
    overflow-x: scroll;
    overflow-y: scroll;
    width: 600px;
    height: 600px;
    border: 2px solid purple;
}
#outer {
    overflow-x: hidden;
    overflow-y: scroll;
    width: 400px;
    height: 400px;
    border: 2px solid yellow;
}
#inner {
    position: relative;
    overflow-x: scroll;
    overflow-y: hidden;
    width: 400px;
    height: 500px;
    border: 2px solid blue;
}
#innercontent {
    width: 1000px;
    height: 1000px;
    border: 10px solid green;
}
#outercontent {
    width: 1000px;
    height: 600px;
    border: 10px solid red;
}
#outeroutercontent {
    width: 1000px;
    height: 1000px;
    border: 10px solid blue;
}
</style>
<div id=outerouter>
    <div id=outeroutercontent>
        <div id=outer>
            <div id=outercontent class=content>
                Vertical
                <div id=inner>
                    <div id=innercontent>Horizontal</div>
                </div>
            </div>
        </div>
    </div>
</div>

Actions: View

Attachments on bug 199222: 372913 | 372914 | 373030 | 373104