在 flex 中使用 text:ellipsis

在 flex 中使用 text:ellipsis 时，发现不起作用，代码如下：
css:

      .flex{
        display: flex;
      }
      .flex .column1 {
        flex: 0 0 100px;
      }
      .flex .column2 p {
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        flex: 1;
      }

html:

  <div class="flex">  
	  <div class="column1">column1</div>  
	 <div class="column2">  
		<p>
		  中国，是以华夏文明为源泉、中华文化为基础，并以汉族为主体民族的多民族国家，通用汉语、汉字，汉族与少数民族被统称为“中华民族”，又自称为炎黄子孙、龙的传人。   </p>  
	 </div>  
  </div>

后来查了一下，有个小技巧，给 column2 加上 min-width: 0, 问题解决。

代码如下：

      .flex{
        display: flex;
      }
      .flex .column1 {
        flex: 0 0 100px;
      }
      .flex .column2 p {
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
        flex: 1;
		   min-width:0;
      }