HTML5 input required, scroll to input with fixed navbar on submit

Question

When trying to submit a form with missing required fields, my browser (Chrome), displays a message mentionning there is a field missing, and if it\'s out of my screen, it sc

Answer 1

In modern browsers there is a new CSS property for that use case:

html {
    scroll-padding-top: 50px;
}

Your JSFiddle updated: http://jsfiddle.net/5o10ydbk/

Browser Support for scroll-padding: https://caniuse.com/#search=scroll-padding