Центрированный фон + полный контейнер страницы

Question

Я хочу поместить фон (ширина = 1250px) по центру страницы, но контейнер должен иметь ширину браузера

Этот центр фона:

#container{margin:0 auto;background:#000 url("images/background.jpg") no-repeat;width:1250px;;}

И это установить ширину контейнера = браузер

#container{margin:0 auto;background:#000 url("../../../images/background.jpg") no-repeat;width:100%;position:relative;}

Как получить центрированное фоновое изображение и контейнер на всю страницу?

Спасибо!

Answer 1

Измените правило фона на это:

background:#000 url(images/background.jpg) center center no-repeat;

Или, если вы хотите расположить его по центру вверху страницы, сделайте следующее:

background:#000 url(images/background.jpg) center top no-repeat;

Тогда вы можете удалить margin: 0 auto, потому что он бесполезен с шириной 100%.

Answer 2

базовый CSS

background: #000 url(../../../images/background.jpg) no-repeat center center;

Примечание: вам не нужны кавычки в CSS. На самом деле, в некоторых случаях могут возникнуть проблемы при использовании кавычек.