如何使<li>标签自动调整大小

Question

我有这个高度为60px的li。

但是如果我把我的内容包含超过200个字母，那么内容就会超出li。

如何使李自己成长？

 #myUL li 
{
    height: 60px;
              
    word-wrap: break-word;
    max-height: auto;
}

<ul id="myUL">
  <li>
   <span class="post">ljcbnvkdsjbvdskjbvdskjbvdskjvbsdkjbvksdjvbsdkjvbsdkjvbsdkjvbdskjvbdskjbvsdbvsdkjdbvdskjbvdksjvbsdkjbvsdkjvbsdkjvbsdkjvbsdkjvbsdkvjbsdkjvbdskjvbsdkjvbsdkjvbsdkjvbsdkjvbsdkjvbsdkvjbsdvkjbsdkvjbsdvkjdsbv
   </span>
   <span class="close">&#215;</span>
   <div class="id-content">
   <span class="content">By </span>Mera Yahan
   <span class="content"> @ </span> 11:21 pm                
   </div>
 </li>
 <hr />
</ul>

Answer 1

您的代码有：

#myUL li 
{
  height: 60px;
  word-wrap: break-word;
  max-height: auto;
}

你应该：

#myUL li 
{
  min-height: 60px;
  word-wrap: break-word;
  height: auto;
}

Answer 2

 #myUL li 
{
    height:60px;
     overflow:auto;
    word-wrap: break-word;
    max-height: auto;
}

您可以添加overflow属性以获得所需的结果。

或只是

#myUL li 
{
    height:auto;

    word-wrap: break-word;

}