Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/css/36.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Css flexbox子项中的文本溢出_Css_Overflow_Flexbox - Fatal编程技术网
Fatal编程技术网
  • css/
  • Css flexbox子项中的文本溢出

Css flexbox子项中的文本溢出

css

Css flexbox子项中的文本溢出,css,overflow,flexbox,Css,Overflow,Flexbox,我有两个主要部分：.main和.sidebar .row { display: flex; } .main { flex: 1; } .sidebar { flex: 0 0 20%; } 在Chrome中一切正常（第一个屏幕截图）侧边栏的宽度为20%。但在Firefox中，即使我有溢出：隐藏（第二个屏幕截图），它也会扩展到文本宽度。当我给出.latest list li最大宽度：0时，它缩小到宽度的20%，但内容消失（第三个屏幕截图） 截图： 截图： 截图： 简化示例 .row{disp

我有两个主要部分：
.main
和
.sidebar

.row { display: flex; }
.main { flex: 1; }
.sidebar { flex: 0 0 20%; }
在Chrome中一切正常（第一个屏幕截图）<代码>侧边栏的宽度为20%。但在Firefox中，即使我有
溢出：隐藏
（第二个屏幕截图），它也会扩展到文本宽度。当我给出
.latest list li
最大宽度：0
时，它缩小到宽度的20%，但内容消失（第三个屏幕截图）




  • 截图：
    • 

  • 截图：
    • 

  • 截图：
    • 
简化示例


    .row{display:flex；}
.main{flex:1；}
.sidebar{flex:020%；}
.sidebar a{溢出：隐藏；空白：nowrap；}
    

    
Lorem ipsum dolor sit amet，奉献精英。是否拥有所有权，是否是发明人illum Laboraum doloremque的自愿义务，是否具有同等的流动性？准静脉性阻抗。Lorem ipsum dolor sit amet，奉献精英。我们的智慧是永恒的，我们的智慧是永恒的！你是说，你是不是不知道该怎么做？

    尝试将
    溢出：隐藏
    切换到父容器
    
与此相反：
    

    .sidebar { flex: 0 0 20%; }
.sidebar a { overflow: hidden; white-space: nowrap; }

    
试试这个：
    

    .sidebar { flex: 0 0 20%; overflow: hidden; }
.sidebar a { white-space: nowrap; }