flex使用中遇到的问题

1、解决内容超出屏幕宽度，如下，如果内容长度超出屏幕，text-overflow: ellipsis不会生效，内容溢出屏幕

<div class="a">
   <div class="b">内容...</div>
   <div class="c">按钮</div>
</div>
<style>
   .a{
      display: flex;
    }
    /* 未给b, c设置规定宽度 */
     .b{
        text-overflow: ellipsis;
        white-space: nowrap;
        overflow: hidden;
     }
</style>

解决方法：对b新增设置如下：

.b{
     overflow: hidden;
     flex: 1;
}
// 或
.b{
     width: 0;
     flex: 1
}

2、父元素设置了display:flex，父元素底下有两个子元素，第一个子元素设置了固定宽度，怎么让第二个元素占用父元素剩余的宽度？

flex: 1; // 对第二个子元素设置flex: 1