Фон Div не позиционируется с Div - PullRequest
Новая
       26

Фон Div не позиционируется с Div

1 голос
/ 01 декабря 2008

У меня есть пара Div, которые я стилизую, используя класс и ID, сами div'ы являются emtpy, поскольку они являются только заполнителями для своего фона. Пример Div: 

<div id='ranImg1' class='ranImg'></div>

Затем я их стилизую, используя этот CSS: 

.ranImg {
  position:fixed;
  z-index:0;
  width:250px;
  height:250px;
  display:block;
}
#ranImg1 {
  left:10px;
  top:200px;
  background-attachment:fixed;
  background-image:url(http://localhost/MyAlbum//images/background/ranPaperclips.png);
  background-repeat:no-repeat;
}

Пока Div находится в левой верхней части документа, изображение отображается правильно, но когда Div размещается где-то еще на странице, изображение остается (невидимым) в верхнем левом углу страницы, показывая только ту часть, перекрывается с div (в данном примере это будет нижняя часть изображения).

EDIT Я пытаюсь расположить эти элементы без изменения моего другого макета, они находятся за другим макетом. Это работает, за исключением того факта, что фоновое изображение не соответствует позиции divs.
Поэтому, в основном, мой вопрос: почему не фон для позиционирования div ranImg1 с div, а остается в левом верхнем углу, и как это исправить?

1 Ответ

3 голосов
/ 01 декабря 2008

ваш background-attachment:fixed прикрепит фоновое изображение относительно окна браузера. если вы хотите, чтобы он «следовал» за позицией div, просто удалите строку: 

#ranImg1{
  left:10px;
  top:200px;
  background-image:url(http://localhost/MyAlbum//images/background/ranPaperclips.png);
  background-repeat:no-repeat;
}

Вы также можете установить атрибут background-position, чтобы установить фон относительно содержащего div: 

background-position: 0px 0px;

Я не уверен, поможет ли это кому-либо, кроме простого удаления background-attachment, хотя (еще недостаточно кофе!)

...