Фон (картинкой + цветом) вне блока с контентом и в шапке

[Миколас]

Скопируй правила css для футера из установочного пакета.

[Agent]

Скопируй правила css для футера из установочного пакета.

В стилях футера я вообще не трогал ничего. Только !important добавил к цвету дефолтной заливки footer-container, а то прозрачная получалась без этого.
Футер обрезается только после вставки двух вышеуказанных строчек в файл header.tpl и global.css
Как убираю эти изменения, то с футером все в порядке становится.

[Agent]

Решил с футером, поставил в файле header.tpl код сразу после </header>. Теперь норм все.

Код: [Выделить]

</header>
<header id="header" class="container">
Тут еще один ньюанс возник с фоновым изображением в шапке и блоком контента при увеличении (уменьшении) масштаба.
Картинка вот таким образом прописана:

Код: [Выделить]

header {
  z-index: 1;
  position: relative;
background: url(../img/verh.png) no-repeat 208px 70px !important;
   }
Вот так выглядит при 100% масштабе:


PS Позже заметил, что поле контента так ровно по отношению к меню отображается только в Mozilla.
В других браузерах как на следующем скрине.

При увеличении масштаба картинка смещается вправо и блок контента увеличивается по ширине:



При уменьшении масштаба картинка смещается влево:




            
            

[Adik]

Нужно указывать координаты фона в %

Код: [Выделить]

background: url(../img/verh.png) no-repeat ...% ...% или для разных разрешений создавать свои правила.

[Agent]

Поставил 81% 44%
При уменьшении масштаба по вертикали все нормально . А по горизонтали съезжает вправо.
При увеличении масштаба по вертикали съезжает вниз, по горизонтали становится шире всего остального до краев экрана.

И как быть с блоком контента, расширяющегося при увеличении масштаба на величину отступа 15px, который я задал чтобы слайдеры не примыкали к фону бэкграунда вплотную?

[DarinSr]

Для этого задают разные размеры для разных разрешений.

Код: [Выделить]

/* Large Devices, Wide Screens */
@media only screen and (max-width : 1200px) {
}
/* Medium Devices, Desktops */
@media only screen and (max-width : 992px) {
}
/* Small Devices, Tablets */
@media only screen and (max-width : 768px) {
}
/* Extra Small Devices, Phones */
@media only screen and (max-width : 480px) {
}
/* Custom, iPhone Retina */
@media only screen and (max-width : 320px) {
}основные разрешения экранов, для каждого создаете свои правила.