HTML и CSS: фиксированная позиция, когда нет полосы прокрутки

Question

Я делаю шаблон для сайта с «фиксированным нижним блоком (FF_BLOCK)», некоторым контентом и «блоком фонового изображения (BG_BLOCK)» (также с некоторым контентом) ,

Если контента недостаточно, BG_BLOCK следует размещать непосредственно над FF_BLOCK (позиция: фиксированная; нижняя: 0px). Я никогда не хочу разрыва между FF_BLOCK и BG_BLOCK.

Когда имеется много контента (и полоса прокрутки), BG_BLOCK может отображаться так, как сейчас.

Возможно ли это только при использовании HTML + CSS или использование JS неизбежно?

Текущий HTML

<div id="navigation">...</div> 
<div id="content">...</div> 
<div id="BG_BLOCK">...</div> 
<div id="FF_BLOCK">...</div> 

Текущий CSS

#BG_BLOCK { 
background: url(../images/background.jpg) repeat-x top center; 
height: 380px; 
padding-top: 467px; 
margin-top: -347px; 
} 

#FF_BLOCK { 
position: fixed; 
bottom: 0px; 
} 

Смотреть это изображение:

Answer 1

вы пробовали min-height:?

BG_BLOCK { 
    min-height: 100%; 
} 

Я предполагаю, что фоновое изображение достаточно велико. Если нет, используйте background-size: cover или background-size: auto 100%, чтобы заполнить весь экран.

Answer 2

Вы объявили FF_BLOCK (позиция: исправлена). с тем, что ваш FF_BLOCK был удален из обычного потока страницы. используйте минимальную высоту с некоторым другим позиционированием, затем фиксированным.