一个简单的css中div的问题

Question

父div为relative子为absolute
        <div class="photo">
        <div class="img"><img alt="" src="../img/zc_an.png" /></div>
        <div class="word"></div>
        <div class="txt"></div> 
        </div>
现在是photo的高度 ，不能自适应，
我的css为：
 .photo
    {
     width:220px;
     float:left;
     margin-left:5px;
     vertical-align:text-bottom;
     position:relative;
     padding:1px;
height:auto; 
display:block;
overflow:visible;
    }
    .img
    {
     width:220px;
     position:absolute;
     bottom:84px;
         height:auto !important; 
         
    overflow:visible;
    display:block;    
    }
    .word
    {     height:24px;
     width:220px;
     position:absolute;
     bottom:60px;
    }
    .txt
    {
     width:220px;
     height:60px;
     position:absolute;
     bottom:0px;
    }

Answer 1

  clear:both;
  position:relative;overflow:auto;height:auto;