Положение: относительный для якорей в webkit сломан. Обходные?

Question

В нашем проекте мы использовали следующий метод для привязки пользователей к некоторой привязанной области на странице:

<span style="position: relative; top: -100px; z-index: -1; visibility: hidden;"
                   id="anchor">&nbsp;</span>

Это использовалось, чтобы оставить немного места перед точным привязанным элементом, таким как форма.

http://gyazo.com/9f714647b516254f5220910b0cace532.png

Но, поскольку в некоторых более поздних версиях Safari он не работает, браузер позиционирует его в начальной позиции элемента без учета относительной позиции.

Маби, вы тоже столкнулись с этой функцией / ошибкой, и вам есть над чем поработать, чтобы предложить или можете указать, почему мой метод плохой. Thx!

Answer 1

Да! спасибо неправильному, но полезному ответу Developer Art я получил решение!

Если я применяю идентификатор и относительную позицию к DIV , привязка к #id начинает работать с относительной прокруткой!

Answer 2

Почему бы вам просто не добавить атрибут ID к рассматриваемому элементу, т.е. FORM? Если вы хотите добавить вертикальный интервал перед формой, вы можете использовать CSS:

<form id="anchor" style="margin-top: 100px;">
 …
</form>

Проблема устранена, и код намного чище:)