Ajustar a altura do scroll quando validar campo

Boa tarde.

Estou utilizando a validação HTML5 no meu formulário. Quando algum campo está inválido, aparece aquele balãozinho e o scroll vai até o campo. O problema é que tenho um header fixo e ele posiciona a barra de rolagem bem em cima desse header, deixando o campo escondido.

Existe alguma forma de alterar esse scroll?

Até encontrei na internet uma possível solução para isso:

var elements = document.querySelectorAll('input,select,textarea');

for (var i = elements.length; i--;) {
 elements[i].addEventListener('invalid', function () {
 this.scrollIntoView(false);
 });
}

Que adiciona um "false" para o scrollIntoView de todos os inputs, selects e textareas do site... porém, não funcionou.