CSS - предотвращает переполнение тела элемента с абсолютным позиционированием - PullRequest
7 голосов
/ 30 марта 2012

У меня есть элемент на странице, который позиционируется абсолютно с использованием стилей TOP и LEFT CSS.Когда он расположен в отрицательной позиции в левой или верхней области, это не проблема.Однако, когда элемент находится в левом положении, превышающем внутреннюю ширину окна, появляются полосы прокрутки.

Есть ли способ как-то помешать этому элементу сделать это?Не могу установить переполнение: скрыто;к моему элементу тела, поскольку это разрушит мое расположение.Например, свойство типа overflow-parent:none; было бы замечательно (но, к сожалению, не существует)

Ответы [ 2 ]

6 голосов
/ 30 марта 2012

Вы должны работать с вложенными div, которые несут все разные обязанности:
Крайний устанавливает позицию слева и справа одновременно.right:0 устанавливает его вправо.

Внутренний div - это реальный div контента, который устанавливает ширину.

Вот демонстрационная версия: http://jsfiddle.net/atnc3/44/

<div class="abs-position">
    <div class="abs-content">
         Absolut Vodka       
    </div>
</div>

.abs-position {
    position:absolute;
    right:0;
    left: 300px;
    overflow: hidden;
}
.abs-content {
    width: 400px;
}

.abs-position {
    position:absolute;
    right:0;
    left: 300px;
    overflow: hidden;
    /* following: just for demonstration purposes */
    padding: 5px;
    border: 1px solid gold;
    opacity: 0.8;
}
.abs-content {
    width: 400px;
    /* following: just for demonstration purposes */
    padding: 5px;
    background: lightgray;
}
.container {
    width: 600px;
    background: cornflowerblue;
}
<div class="abs-position">
    <div class="abs-content">
         Absolut Vodka       
    </div>
</div>
<div class="container">
Other content<br>
Other content<br>
Other content<br>
Other content<br>
</div>
0 голосов
/ 30 марта 2012

Я думал, что абсолютно позиционированный элемент не занимает места. У вас есть «ясно» в вашем элементе?

Попробуйте добавить элемент в качестве быстрой проверки? (Плавать: слева);

...