Technically, this is possible if any one element does not exceed the maximum height. But for practical purposes, this is not possible, because the behavior of the browser becomes strange when the total height of the body exceeds the limit.
In IE11, it seems to work fine:
div{ background: red; color: white; height: 10737418px; } .blue { background: blue; color: white; }
<div> Test </div> <div class="blue"> Test </div> <div> Test </div> <div class="blue"> Test </div>
All four div displayed using CSS. You can find the word “test” and it will scroll to the word all four times.
In Firefox, the scroll height will be greater than the maximum size, but it will stop displaying anything lower:
div{ border: 3px solid purple; height: 17895697px; } .blue { background: blue; color: white; } .red { background: red; color: white; }
<div> Test </div> <div class="blue"> Test2 </div> <div class="red"> Test3 </div>
In the first box there is a purple border of 3px. Firefox doesn't even display the bottom border, and the other 2 div don't display at all. The browser can say that the word "test" is on the page 3 times, but with the help of "Find" the page will not scroll to another page div . He is just sitting there.
In Chrome, everything is just weird:
div{ border: 3px solid #000000; background: #CCCCCC; height: 99999999999999999999999999999999999999px; }
<div> Test </div> <div> Test2 </div> <div> Test3 </div>
The first div does not receive the border at all, and for some reason the div border repeats over and over after the first div , although there are only two other div on the page, Chrome “Find” recognizes that the word “Test” is only on the page 3 times, but he thinks the second second is at the very bottom of the page. The word "Test" is not displayed 2 or 3 times.
You get other odd behavior if you add items that are tall in a container with a fixed height and overflow set to scroll.
The only way I can get around this is to make sure the page height never exceeds the limit.
If this is static content, just split it into several pages.
If this is dynamic content, you can:
Set an arbitrary limit on how much content is placed on the page before it creates a link to additional pages.
Limit the amount of visible content at a time
- EX: the FAQ page with the layout of the accordion, so you need to click on the question of the appearance of the answer and display only one answer at a time
Set a limit on the number of records / results
Hide / collapse / delete content that the user has scrolled (I have not tried this, but if you can do this, I do not understand why this will not work.)