背景,做一個前面圖片寬度固定,後面寬度自適應,使用到了flex佈局,但是想讓後面div里文字不換行,超出以點點表示時,這時佈局就亂了,查了下,原來flex佈局與white-space:nowrap有影響 解決辦法,父div設置min-width:0即可 ...
背景,做一個前面圖片寬度固定,後面寬度自適應,使用到了flex佈局,但是想讓後面div里文字不換行,超出以點點表示時,這時佈局就亂了,查了下,原來flex佈局與white-space:nowrap有影響
解決辦法,父div設置min-width:0即可
<div style="width:100%;display:flex;height:80px"><div style="width:50px"><img src="~/Content/Img/2.png" style="height:50px;" /></div><div style="flex:1;min-width:0"> <div style="width:100%;height:40px;text-align:left;font-size:16px"> ******* </div> <div style="width:100%;height:40px;text-align:left;font-size:14px;padding-left:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis"> ********* </div> </div> <div class="clearfix"></div> </div>