CSS об абсолютном положении

Question

вот пример http://jsfiddle.net/FW38N/1/

, как я могу сделать DIV (контейнер) с высотой: авто вместо того, чтобы его с фиксированной высотой

 .container{ 
     width:auto; 
     height:auto; 
     background-color:black; 
     position:relative; 
    } 

    .text { 
     position:absolute; 
     width:50px; 
     height:50px; 
     background-color:red; 
    } 

<div class='container'> 
     <div class='text'> 

     </div></div> 

Answer 1

Я не верю, что есть способ для этого без использования JavaScript или jQuery.

Когда элемент имеет position:absolute, он не занимает пространство внутри родителя. Он отделен от макета и потока страницы (например, всплывающего окна). В приведенном выше примере родитель будет иметь ноль, потому что в нем нет ничего занимающего место. Это фундаментальная часть того, как ведет себя абсолютное позиционирование.

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

Если у родителя был position:absolute вместо ребенка, то родитель мог иметь height:auto.

Answer 2

просто написать height:100%; он установит высоту дел до размера текста + полях

Answer 3

вы также можете попробовать

<p class="text"> 
    Lorem ipsum dolor sit amet ... 
</p> 

, а не DIV