: после абсолютно позиционированного div

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

Это мой 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;
}

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

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