2014-02-18 3 views
0

Возможно ли иметь элемент после элемента для элемента, который абсолютно расположен?: после на абсолютно позиционированном div

Это мой DIV и абсолютно позиционирован:

<div id="myDiv" class="box">..</div> 

.box 
{ 
    width: 60px; 
    height: 240px; 
    position:absolute; 
    background:#333; 
    top:0; 
    left:0; 
} 

Я хочу, чтобы добавить эффект виньетки к выше DIV, так что у меня есть это:

.vignette:after{ 
    -webkit-box-shadow: inset 0px 0px 85px rgba(0,0,0,0.4); 
    -moz-box-shadow: inset 0px 0px 85px rgba(0,0,0,0.4); 
    box-shadow:   inset 0px 0px 85px rgba(0,0,0,0.4); 

    position: absolute; 
    top: 0; left: 0; bottom: 0; right: 0; 
    content: ""; 
} 

Однако это работает только если Я добавляю:

.vignette 
{ 
    position:relative; 
} 

проблема заключается в виньетка класс добавляется myDiv, поэтому он отменяет абсолютное позиционирование (который мне нужен для myDiv).

В любом случае, я могу добавить один и тот же эффект виньетки, даже если myDiv сохранен в любом положении?

+0

Я сделал скрипку из этого, и он отлично работает: http://jsfiddle.net/pavloschris/v7CXw/ Существуют ли другие элементы в 'myDiv'? – xpy

+0

Спасибо. Кажется, ты прав. Должно быть что-то еще происходит. Позвольте мне закрыть мой вопрос. – Prabhu

ответ

1

Возможно с absolute позиционируется div, если вы меняете top: 0; left: 0; bottom: 0; right: 0; на top: 0; left: 0; width: 100%; height: 100%; в .vignette:after определение стиля.

+0

Хмм, это не похоже на это. Он винит всю страницу. – Prabhu

+0

У вашей '.vignette' есть' позиция: absolute'? –

Смежные вопросы