Как настроить фоновое изображение так, чтобы оно сохраняло свое положение при изменении ширины браузера?

Мне интересно, как я могу установить фоновое изображение, чтобы оно сохраняло свою позицию на этом сайте: http://www.jylkkari.fi/wordpress/

Когда вы перетаскиваете браузер шириной менее 960 пикселей, фон боковой панели начинает двигаться к центру.

Я обнаружил этот Javascript, который может решить эту проблему.

Я все еще ищу, есть ли в CSS простой способ удерживать изображение в центре, когда ширина браузера превышает 960 пикселей, и фиксировать, пока оно меньше этого размера?


css background-position browser-width
person Ipi    schedule 02.10.2012    source источник

Ответы (3)


arrow_upward
0
arrow_downward

.......................... Определите свое тело

min-width:980px;

body{
min-width:980px;
}

-------------- для т.е.

используется для т.е. условия css, как это

 <!--[if lt IE 8]>
    <link rel="stylesheet" type="text/css" href="ie8-and-down.css" />
<![endif]-->

создать файл css

body{width:980px;}

больше информации о т.е. css нажмите здесь

person Rohit Azad Malik    schedule 02.10.2012
comment
Я понял, но есть ограничение по времени. - person Ipi; 02.10.2012
comment
Вы должны быть осторожны, когда хотите использовать минимальную ширину. В IE не поддерживается. Вы также должны установить ширину, если вы собираетесь показывать страницу в IE‹8. - person Marcio; 02.10.2012
comment
У вас есть совет, как сделать это для IE‹8? - person Ipi; 02.10.2012

arrow_upward
0
arrow_downward

Сделайте это, добавив width: 960px; к элементу, на котором находится фоновый оператор (в вашем случае это будет body).

person ranieuwe    schedule 02.10.2012

arrow_upward
0
arrow_downward

Вы можете использовать медиа-запрос, чтобы изменить CSS тела, когда оно достигает определенной ширины:

@media all and (max-width: 960px) {
  body {
    background-position: left center;
  }
}
person LeonardChallis    schedule 02.10.2012