Якорные точки имеют разные позиции в разных браузерах

Question

Я пытаюсь создать ссылку, которая идет непосредственно к определенному разделу другой страницы. Вот что я делаю.

1. создать узловую точку, используя имя атрибута:

   <a name="fish"></a> <p>some content....</p>

2. я создаю ссылку с # добавляется в конце "http://example.com#fish"

* ** note. Я также попробовал метод id вместо имени, который по-прежнему дает мне такую ​​же проблему.

пример: <div id="fish"></div>

Функциональность работает отлично, и он принимает меня к определенной части на странице, единственная проблема в том, что она выглядит по-разному в разных браузерах. Какие дисплеи firefox примерно на 5 дюймов выше, чем у хромовых дисплеев.

Answer 1

Возможно, это связано с тем, что тег занимает некоторое пространство.

Простое решение, вместо этого используйте идентификатор.

<p id="fish">some content....</p> 

Убедитесь, что есть достаточное содержание ниже, поэтому он может прокручивать

Answer 2

Большинство браузеров имеют одинаковое значение CSS по умолчанию для обычных HTML элементов, однако, возможно, что некоторые элементы имеют различные значения атрибутов для заполнения и полей.

Один из способов избежать этих различий заключается в явном применении значений в операторах css.

p {margin: 10px 0px} 

Если вы не хотите этого делать, я рекомендую вам установить ссылку точно в том месте, где находится текст.

<p><a name="fish"></a>some content....</p> 

Вы можете найти по ссылке в любом месте, так как элемент анкер не будет виден в окне