How to solve the problem of emptying the upper and lower segments of iPhone x

each page has an empty space and different colors. There is no such problem on simulators and non-iphone x real machines.
means that there is an extra paragraph up and down on iphone x real machines

.

for example, there is an extra

in the picture box.

clipboard.png


solution: set up and down two div, to enter the page to determine that it is displayed when it is iPhone X, and hide when it is not iPhone X

isIphoneX:function(){
        return /iphone/gi.test(navigator.userAgent) && (screen.height == 812 && screen.width == 375)
}
Menu