收藏
回答

当使用弹性盒后,同一行的文字会把同一行的图片压扁,图片设置了固定宽度也没用

比如一个view组件下有一个image组件(image设置了固定宽度)和一个text组件。给view设置了display:flex后,会发现如果text文字比较多的话会把image给压扁。在正常h5页面里是不会出现这种问题的,因为image设置了固定宽度。


代码片段:wechatide://minicode/hHNa8hmJ7iH9

最后一次编辑于  2018-06-19
回答关注问题邀请回答
收藏

1 个回答

  • other
    other
    2018-06-19

    image设置 flex-shrink:0


    2018-06-19
    赞同
    回复 3
    • 唐伯虎点蚊香
      唐伯虎点蚊香
      2018-06-19

      我加上了可以了,但是为啥flex-shrink设置为0就可以了呢?为啥正常h5页面里不设置的也不会出现这种问题呢?

      2018-06-19
      回复
    • other
      other
      2018-06-19回复唐伯虎点蚊香

      http://www.ruanyifeng.com/blog/2015/07/flex-grammar.html  原因在这里   正常h5页面不太清楚

      2018-06-19
      回复
    • 唐伯虎点蚊香
      唐伯虎点蚊香
      2018-06-19回复other

      嗯,谢谢,也就是设置了flex-shrink:0的话就不会缩小,但是还是不清楚为啥正常h5里不用设置这个,只设置固定宽度就没事。

      2018-06-19
      回复