CSS absolute DIV вызывает другие проблемы абсолютного DIV - PullRequest
0 голосов
/ 25 мая 2010

Я реализовал скрипт чата, который требует, чтобы абсолютно позиционированный DIV был обернут вокруг содержимого страниц.

Это делается для того, чтобы окна чата оставались внизу.

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

Вот пример HTML:

<body>
<div id="main_container">
    <div id="content">Elements like Jquery Autocompletes, Datepickers with absolute positioned elements in here</div>
</div>

Стиль DIV "main_container" выглядит следующим образом:

#main_container {
    width:100%;
    background-color:#ffffff; /* DO NOT REMOVE THIS; or you'll have issue w/ the scrollbar, when the mouse pointer is on a white space */
    overflow-x: hidden;
    overflow-y: scroll;
    height:100%;    /* this will make sure that the height will extend at the bottom */
    position:absolute; /* container div must be absolute, for our fixed bar to work */
}

Я надеюсь, что есть простое исправление, так как скрипт чата слишком хорош, чтобы от него избавиться.

Спасибо

Тим

1 Ответ

0 голосов
/ 25 мая 2010
  1. Вам, вероятно, лучше сделать то, что вы хотите, чтобы оставаться в фиксированной позиции относительно области просмотра, позиция: фиксированная;.
  2. Цвет фона выглядит как плохой взлом.
  3. Вы можете установить положение окружающего элемента (основного): относительное, не задавая ему свойства top / left / right / bottom и каждый «фиксированный» элемент в пределах, position: absolute, так как теперь они будут относительно родительского элемента, который имеет положение :. родственник
  4. Если ничего из этого не работает, опубликуйте больше кода, особенно для позиционирования ваших «элементов, которые прокручиваются вверх и вниз по странице». Также неясно, что вы имеете в виду под «страницей». Тело? Html? Viewport? основное содержание?
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...