flex 布局子内容p元素被撑开

2020-01-04 08:19:28

描述一种情况,父元素 flex 布局,子元素有一行文字,将其设置为不换行隐藏后显示省略号,但实际并不是想象的那样,而导致布局变形。

这种情况是因为 flex 布局特性,子内容优先被内容撑开使得文字不隐藏。

解决:将该元素的宽度设置为 0 ,然后使用 flex:1 样式,将宽度交给 flex 布局来决定,最终子元素不会被内容撑开,达到想要的效果。


19.11.22更新 - 将该元素的宽度设置为 auto 也是可以的,我认为这样更为合理

大体是上面这样,比如div 进行 width:0  里面等p元素设置如下属性

.{
  : : : }

 这样就解决了问题


参考地址 flex布局被子元素撑开,如何保持内容不超出容器

  • 2018-01-17 01:55:49

    Android设置控件不可点击

    学会安卓控件的不可点击,再加上控件的透明度,估计你会做出不错的效果来。

  • 2018-01-17 15:58:16

    java实现定时任务的三种方法

    在进行多线程编程中,比较重要也是比较困难的一个操作就是如何获取线程中的信息。大多数人会采取比较常见的一种方法就是将线程中要返回的结果存储在一个字段中,然后再提供一个获取方法将这个字段的内容返回给该方法的调用者。如以下的ReturnThreadInfo类: