On the mobile side, if there is an element in the div that sets the min-height with a margin-bottom attribute, will the div be stretched apart to make the page appear a scroll bar?

the simple code is as follows, in chrome mobile mode

<div style="border:1px solid -sharp000;height:667px;width:375px;overflow:scroll">
    <div style="min-height:667px">
        <div style="height:10px;margin-bottom:10px"></div>
    </div>
</div>
A scroll bar appears when

margin-bottom:10px is removed, but even if the div is added to the margin, the parent div cannot be propped apart. Why is there a scroll bar?

Mar.08,2021

seems to have nothing to do with margin-bottom. It should be caused by overflow:scroll. If you change this to overflow:auto


block element, then inline-block should not have scroll bars.


the div of
min-height has been solved by adding the class page
css

.page:after{ content:"."; clear:both; display:block; height:0; visibility:hidden; }
The essence of

is to add the last element without margin-bottom to the div of min-height, and it is not a fundamental solution

.
Menu