Как исправить позиционирование у подсказки?

Question

[ValeraValera]

Вот страница с проблемой
На странице напротив услуги знак вопроса по наведению должен всплывать блок с id="hint"
вот css его

#hint{
    display:none;
    position: absolute;
    border:1px solid #ccc;
    padding:5px;
    width: 250px;
    background:#fff;
    border-radius:5px;
    font-size: 14px;
}

но этот абсолют берет за точку отсчета фиг пойми что и блок с id="hint" всплывает по наведению в районе футера
я уже туплю под вечер , где пофиксить нужно чтобы блок с id="hint" показывался над знаком вопроса с relative проблема

$(document).ready(function(){
    $('.hover').mousemove(function(e){
        var hint = $(this).attr('ht');
        $('#hint').css({'left': e.pageX, 'top': e.pageY});
        $('#hint').show().text(hint);
    }).mouseout(function(){
        $('#hint').hide();
    });
});

Answer 1

[Андрей Федоров]

У блока #hint должна быть не только position: absolute, но и родитель с position: relative, который собственно и задает точку отчета для абсолютной позиции #hint. Если его нет, позицию задает элемент body.

Comments

[ValeraValera]

я оборачивал его в div c relative , та же песня

[Андрей Федоров]

Валерий Виткус: Вот пример - codepen.io/aliencash/pen/zozPaR