css проблема с divs

У меня есть div. Мне нужно в двух детей. Первое должно быть в статическом положении и под вторым.css проблема с divs

alt text http://a.imageshack.us/img685/8185/imgpk.png

Оранжевый прямоугольник должен быть расположен на родительский DIV и имеет статическое положение (например, верхний: 20px;). Второй ребенок (красный прямоугольник) должен быть над всеми другими div.

Я попытался сделать абстракцию абсолютного абсолютного и использовать z-index для управления draw-queue. Но он всегда наверху (или ниже всего другого, когда индекс z отрицательный)

Не могли бы вы мне помочь?

UPD

<div id="content"> 
     <div id="secondChild"></div> 
</div> 
<div id="firstChild"></div> 

#content 
{ 
    position: absolute; 
    width: 100%; 
} 
#secondChild 
{ 
    z-index: 9999; 
} 
#firstChild 
{ 
    position: absolute; 
    z-index: -1; 
}

источник

2010-07-30 Ockonal

Отправьте свой html и css тоже. Код – Sarfraz

поможет нам решить проблему. –

@sac @ liam-spencer Обновлено мое сообщение – Ockonal

Z-индекс работы жгутов рендеринга контекста, так что в вашем случае она должна быть применена к #content, а не второго ребенка. Кроме того, он должен перекрывать то, что вам нужно, если красный div находится после оранжевого div в потоке страницы.

Слишком плохо, что вы не предоставляете полный (er) источник с полями и т. Д., Чтобы я мог попытаться воспроизвести это.

источник

2010-07-30 08:36:33 NPC

Спасибо за согласие, я ожидал, что вы согласитесь с ответом от другого парня, поскольку он дает вам полное решение ... – NPC

Вы можете попробовать это?

<html> 
<head> 
<style type="text/css"> 
#content 
{ 
    position: absolute; 
    height: 300px; 
    width: 200px; 
    margin-left: 30px; 
    background-color: blue; 
} 
#secondChild 
{ 
    z-index: 9999; 
    width: 100%; 
} 
#firstChild 
{ 
    position: absolute; 
    width: 50px; 
    height: 50px; 
    z-index: -1; 
    margin-top: 120px; 
    background-color: red; 
} 
</style> 
</head> 

<body> 
    <div id="content"> 
    <div id="secondChild">Second Child</div> 
    </div> 
    <div id="firstChild">First Child</div> 
</body> 
</html>

источник

2010-07-30 08:38:02 jaxb

css проблема с divs

ответ

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