Движение фиксированной позиции CSS под полосой прокрутки в Firefox

Question

В Firefox (версия 19.0.2) при позиционировании элемента справа от страницы с помощью position: fixed элемент расположен относительно окна окна просмотра справа от полосы прокрутки окна.

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

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

Я выделил проблему, чтобы увидеть, что она не вызвана никакими другими настройками css, установленными на body, html или что-то еще, но я не могу найти причину этой проблемы.

HTML

<a href="#Top" id="ScrollToTop">Top</a> 

CSS

#ScrollToTop { 
    position: fixed; 
    right: 0px; 
    bottom: -10px; 
    width: 50px; 
    height: 50px; 
    background: #ffffff; 
    color: #000000; 
} 
#ScrollToTop:hover { 
    bottom: 0; 
} 

Example

Есть ли причина, это происходит? Это ошибка браузера? Есть ли способ исправить этот случай?

Answer 1

После небольшого поворота моим решением было бы поставить якорь ScrollToTop в другое фиксированное положение div.

HTML

<div id="ScrollToTopHolder"><a href="#Top" id="ScrollToTop">Top</a></div> 

CSS

body { 
    height: 2000px; 
    background: #990000; 
} 
#ScrollToTopHolder { 
    position: fixed; 
    width:100%; 
    bottom:0px; 
} 
#ScrollToTop { 
    position: absolute; 
    right: 0px; 
    bottom: -10px; 
    width: 50px; 
    height: 50px; 
    line-height: 50px; 
    background: #fff; 
    color: #000; 
    text-transform: uppercase; 
    text-decoration: none; 
    text-align: center; 
    font-size: 15px; 
    font-weight: bold; 
    z-index: 1000; 
    border: solid 1px #000; 
    border-bottom: none; 
    border-radius: 10px 10px 0 0; 
    transition: all 0.4s; 
} 
#ScrollToTop:hover { 
    bottom: 0px; 
} 

JSFiddle

Это, кажется, что Firefox не нравится, когда вы перемещаете фиксированное положение якорь, вновь выравнивая его.

Answer 2

Другое решение было найдено, использование мин-ширина вместо ширины для фиксированного положения DIV: https://stackoverflow.com/a/15705522/980692