html - CSS防止文本溢出父div

Question

我有一个网站的描述HTML:

<div class="a_desc">
    <div>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean     commodo ligula eget dolor. Aenean massa. Cum sociis natoque 
</div>
<div>
  Lorem ipsum dolor sit amet, consectetuer Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque </div><div>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque </div>
</div>

CSS:

.a_desc{
position: relative;
margin: 0.4em auto 0 auto;
background: rgba(27,27,25,0.7);
max-width: 500px;
padding:0.4em;
border-radius: 1em;
font-weight: 100;
max-height: 100%:
-webkit-text-size-adjust: 100%;
-moz-text-size-adjust:100%;
-ms-text-size-adjust:100%;
text-size-adjust:100%;
}
.a_desc > div{
margin-bottom: 0.5em;
line-height: 17px;
display: table;
}
.a_desc > div:last-child:after{
  content: ".";
  visibility: hidden;
  display: block;
  height: 0;
  clear: both;
}

它在 android 手机上运行正常，但是当我在 iphone 上测试它时，文本溢出了父 div:

如何避免这种情况，如何扩展父级以适应所有文本？

Answer 1

没有人给我正确的答案，所以我一直在尝试，结果证明只要将父级设置为 display: table; 并将子级设置为 display: table-row 就可以了;