2016-05-24 3 views
2

У меня есть веб-страница, все работает так, как ожидалось. Я даю «контроль» (основанный на javascript), но он не будет работать даже с HTML и CSS! Поэтому, чтобы не допустить этого, я оставил JavaScript вне вопроса.Как сделать контент отображаемым в абсолютной позиции

<!-- start js control--> 
<div style="position:relative;"> 
<div style="position:absolute;"> 
asdf 
</div> 
<div style="position:absolute;"> 
asdf2222 
</div> 
</div> 

<!--rest of web page--> 
<div> 
here is content 
</div> 

https://jsfiddle.net/5zpz4eys/

Как вы можете видеть на скрипке, вопрос текст накладывается. Я думаю, это потому, что абсолют не имеет высоты, хотя в относительном положении внешний div.

В скрипке я оставил большую часть фактического CSS, так как хочу понять его на этом уровне. Что CSS мне нужно добавить ... То, что я ожидал увидеть 3 линии:

asdf 
asf222 
here is content 

Или, я ожидаю увидеть 2 линии, где ASDF и asdf22 фактически наложенные.

Как это сделать?

+0

Без позиционирования это невозможно. Однако изменение «абсолютного» на «относительное» в ваших divs исправляет его. Зачем вам нужны абсолютные позиционные div, когда вы хотите поведение относительных позиционированных div? – rsn

+0

Внутренняя часть должна быть абсолютной, как сложной компоновки. есть много изображений по притирке и т. д. и многие дочерние divs @rsn. возможно, я смогу достичь этого с относительным положением ... – MyDaftQuestions

+0

вы можете обернуть все это в абсолютном/фиксированном положении div. Почему внутреннее должно быть абсолютно точно? – rsn

ответ

1

Используйте относительное позиционирование для внутренних divs, оберните их в абсолютном/фиксированном положении div.

+0

Можете ли вы предоставить пример обертывания их в abosolute /фиксированная позиция? – MyDaftQuestions

+0

https://jsfiddle.net/5zpz4eys/8/ – rsn

+0

спасибо за ответ, но ваш пример показывает абсолютное поле ontop содержимого. Я хотел бы, чтобы контент был после этой абсолютной коробки? – MyDaftQuestions

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