Масштабирование Фоновых вещей до высоты содержимого

Question

Итак, я хочу создать фоновое поле, которое масштабируется до высоты содержимого страницы с помощью CSS. Я перепробовал все, что я умею делать. Задний бокс заземления разбит на три части: верхнюю среднюю и нижнюю. Это сделано для того, чтобы не искажать тень вокруг рамки при ее масштабировании. Все, что контролирует высоту, должно применяться к средней части. Вот сайт http://www.unitedbygaming.com/test.php, и вы можете щелкнуть правой кнопкой мыши по источнику страницы, чтобы увидеть все, что вам нужно. Заранее спасибо за помощь.

Answer 1

Прежде всего, ваше фоновое изображение не в центре, поэтому вот код, который делает его центром

body {
background-image: url("/images/site_background.png");
background-position: center top;

}

удалить из тела css.

background-repeat: no-repeat;

Во-вторых:

Вместо использования этого изображения <img src="/images/dfbox/mid.png" id="dfboxmid"> в html попробуйте назвать его фоновым изображением и нарежьте изображение на его высоту (2435 пикселей), это слишком много, поэтому высота страницы увеличивается.

Вы можете вызвать фоновое изображение и повторить его в направлении repeat-y.

Вы можете увидеть изображение ниже, на котором я удалил ваше затененное изображение.

Вместо того, чтобы использовать все три изображения в одном div, используйте его отдельно в трех отдельных div, таких как Header, middle и footer. Это будет более удобно.