CSS 自适应div 内容折行

版权声明:如若转载,烦请联系作者。 https://blog.csdn.net/ZYD45/article/details/89234075

现象

如图,在一行自适应宽度的div中,原本是两个均分宽度的div,由于其中一个内部单行文本超出,造成宽度变长。

解决方法

在适应布局的div内部 使用table元素布局。不仅要对table设置 table-layout,还要有 width宽度继承父级的设置

 <div> <!-- 自适应的div-->
        <table style="table-layout:fixed;width: -webkit-fill-available;">
            <tr>
                <td>需要换行的文字</td>
            </tr>
        </table>
    </div>

猜你喜欢

转载自blog.csdn.net/ZYD45/article/details/89234075