Extra padding on Chrome/Safari/Webkit -- any ideas?

Viewed 74583

My page has this extra padding on the top of page that I'm unable to remove. Tried everything under the sun and hope someone can show me the way.

Any ideas?

10 Answers

This works with IE (at least IE v10 in my tests):

-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;

The bottom one is the one that works for IE 10, just keeps all the dimensions to what you set a selector/element to be in the width and/or height.

I created a workaround for solving this issue on Chrome iOS. In simple terms, my approach to extending the web page past the iPhone notch is to zoom on the page, and scroll to the middle.

My full details and code can be found onmy github https://github.com/anthonypena97/chromeios-viewportfitcover

enter image description here

Related