遇到的问题如下：在使用flex布局 使其flex:1的元素添加 margin、padding属性时里面的子元素超出一行省略，则在flex:1 的元素添加 min-width:0，生效，好使。
代码如下：
<div class="flex-con">
<div class="flex-box">
<p class="9">
研发测试研发测试研发测试研发测试研发测试研发测试研发测试研发测试研发测试研发测试研发测试研发测试研发测试研发测试</p>
</div>
<div class="flex-box">
<p class="9">
研发测试研发测试研发测试研发测试研发测试研发测试研发测试研发测试研发测试研发测试研发测试研发测试研发测试研发测试</p>
</div>
</div>
<style>
.flex-con{
display: flex;
.flex-box{
flex: 1;
border:1px solid red;
margin: 0 15px;
padding: 15px;
min-width: 0;
p{
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
width: 99%;
}
}
}
</style>
方法一：
根据flex语法，可在设置flex:1的元素(即文字超长元素.tove的父元素)设置宽度属性，如：width:100px; 或 设置min-width:0,2个属性的值可任选其一，宽度值可随意设置，但必须保证小于要限制的显示宽度,否则依旧会被撑开显示
方法二：
可在设置flex:1的元素(即文字超长元素.tove的父元素)设置overflow:hidden;属性，该属性会触发BFC(块级元素格式化上下文)
划重点：如果页面布局结构中有嵌套申明使用flex:1，不管是用方法一、方法二都必需在每个设置flex:1的元素上添加方法中上述对应关键的css属性声明才能生效！！！