扫二维码与项目经理沟通
我们在微信上24小时期待你的声音
解答本文疑问/技术咨询/运营咨询/技术建议/互联网交流
这篇文章主要介绍了flex下省略号的问题怎么解决的相关知识，内容详细易懂，操作简单快捷，具有一定借鉴价值，相信大家阅读完这篇flex下省略号的问题怎么解决文章都会有所收获，下面我们一起来看看吧。
江夏网站建设公司创新互联,江夏网站设计制作，有大型网站制作公司丰富经验。已为江夏数千家提供企业网站建设服务。企业网站搭建\外贸网站制作要多少钱，请找那个售后服务好的江夏做网站的公司定做！
最近在搞微信小程序，发现flex下使用省略号是没有效果的，而且还会打乱预期的结构，查询statckoverflow知道需要在父级设置min-width:0; 但是在我的尝试下，依然不行，原来在上层父级就是flex那一级别也需要设置 min-width:0; 就是可以理解为 省略号标签的flex-item以及所在的flex父级 都需要设置min-width:0;
CSS：
.flex {
display: flex;
align-items: center;
align-content: center;
justify-content: space-between;
min-width: 0; /* 这里也要设置 */
}
.flex__item {
min-width: 0; /* 这里需要设置 */
}
.flex__item--fixed {
flex: 0 0 auto;
}
.fs--ellip {
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.home-shop {
max-width: 750px;
}
.home-shop__img {
width: 98px;
height: 98px;
}
.home-shop__main {
padding: 0 36px 0 18px;
}
.home-shop__fans {
padding: 16px 16px 16px 26px;
border-left: 2px solid #eee;
}HTML：