Нижний колонтитул в нижней части браузера, за исключением случаев, когда я прокручиваю

Question

У меня возникает странная проблема с нижним колонтитулом.

http://jsfiddle.net/YGAvd/

облака в нижней части страницы будет прилипать к нижней части окна браузера, если я увеличить или уменьшить окно. НО, когда я прокручиваю вниз, нижний колонтитул завершается в середине страницы. Это не проблема на любой из моих других страниц, потому что они все вписываются в окно 900x600 до появления полосы прокрутки.

Есть ли способ сохранить нижний колонтитул в нижней части окна, даже когда я прокручиваю (так всегда будет там по содержанию), не испортив код для всех других страниц, которые разделяют документ CSS?

Answer 1

В нижнем колонтитуле CSS правило изменить 'position: absolute;' «позиция» фиксированная;

вам также может потребоваться сыграть с несколькими другими def, но это работает.

check it out

Вот мое последнее правило сноска

footer { 
    position: fixed; 
    color: black; 
    width: 100%; 
    height: 4.6em; 
    background-image: url(http://img.photobucket.com/albums/v410/justice4all_quiet/bottom_clouds.jpg); 
    background-repeat: repeat-x; 
    background-color: e0e0e0; 
    z-index: -999; 
    overflow: hidden; 
    bottom: 0px; 
} 

Answer 2

Не помещайте фоновое изображение в сноске .... сделать это фоновое изображение тела!

Затем сделайте ваше тело тег выглядеть следующим образом:

body { 
    line-height: 1; 
    overflow: auto; 
    background-image: url(http://img.photobucket.com/albums/v410/justice4all_quiet/bottom_clouds.jpg); 
    background-repeat: repeat-x; 
    background-position:bottom center; 
    background-attachment:fixed; 
    background-color: #b1ceff; 
    font: normal 95% Sathu, Verdana, Arial, Tahoma; 
    text-align: center; 
    height: 100%; 
} 

Не забудьте удалить код из нижнего колонтитула для изображения. ТАКЖЕ, удалите цвет фона в нижнем колонтитуле, чтобы избежать каких-либо проблем.