Как я могу сделать фон, пока страница? - PullRequest
0 голосов
/ 05 января 2012

Я столкнулся с проблемой на веб-сайте, который меняю.Фон страницы не продолжается, как баннеры, которые я разместил по бокам, и сайт выглядит ужасно из-за этого.Не могли бы вы помочь мне разобраться, как продлить фон контейнера до тех пор, пока баннеры (1500px)?Извините, мое описание проблемы настолько расплывчато, я помещаю здесь ссылку на веб-сайт с проблемой, чтобы вы могли лучше понять, что я имею в виду.Это http://gentlecare.ro/index.php?route=information/information&information_id=6

Большое спасибо, Ирис

Ответы [ 5 ]

2 голосов
/ 05 января 2012

Поскольку баннеры имеют фиксированную высоту, вы можете добавить тот же атрибут высоты к вашему идентификатору #container.

#container {
width: 990px;
margin-left: auto;
margin-right: auto;
text-align: left;
background: url(../image/layout/bg-container.jpg) center 0 repeat-y;
height: 1504px;
}
2 голосов
/ 05 января 2012

нужно поставить

<div style="clear:both"></div>

до конца вашего container-inner div, чтобы растянуть контейнер до его содержимого

Или лучше использовать CSS Clearfix Best Cross браузерное решение

2 голосов
/ 05 января 2012

похоже, у вас ошибка синтаксиса CSS:

    #column_left {
     float:left;
      width:230px;
      clear:; // needs to be "clear:both"
      padding:30px 0 0 10px;
                 }
2 голосов
/ 05 января 2012

Вы можете использовать свойство background-size. Ограничивается современными браузерами. Вы также можете просто растянуть фоновое изображение.

1 голос
/ 05 января 2012
<div id="container-inner">
<div id="header">
<div id="column_left">
<div id="column_right"> </div>
<div id="content">
<div style="clear:both"></div>// add this
<div id="footer">
<div style="clear:both"></div>// add this
</div>

и это

 #container {
        background-image: url("../image/layout/bg-container.jpg");
        background-size: 990px 1518px;
    }

#footer {
    background: url("../image/layout/bg-footer.jpg") no-repeat scroll center top transparent;
    bottom: 0;
    height: 60px;
    margin: -130px 0 0;
    padding: 70px 20px 0;
    position: relative;
}
...