jQuery UI Resizable Простой фиксированный нижний колонтитул?

Question

У меня есть простой нижний колонтитул, который я хочу зафиксировать в нижней части браузера.Я хочу иметь возможность изменять его размер только по вертикали.Проблема, с которой я столкнулся, заключается в том, что, когда я применяю jQuery UI Re-sizable, он устанавливает относительное положение, которое явно портит первоначальное назначение макета.

Ниже приведен простой пример использования JSBin для моей задачи.

http://jsbin.com/ubuhic/

Мысли?

Answer 1

$(function () {

    $('footer').resizable({
     handles: 'n, s'
    }).bind('resize', function(){
      $(this).css("top", "auto");
    });

});

Этот код отлично работает для меня. http://jsbin.com/ubuhic/11

Answer 2

footer
{
    height: 200px;
    bottom: 0px;
    position: fixed !important;
    width: 100%;
    background-color: #cc0000;
}

!important должен добиться цели ...