div中子元素input设置flex无效

Posted 隔壁小王66

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了div中子元素input设置flex无效相关的知识,希望对你有一定的参考价值。

在flex布局下input设置flex:1失效的原因

由于input默认存在最小宽度,所以在父元素宽度太小的情况下input设置了flex:1会失效

解决办法

1:给input在嵌套一层div,设置flex
2:在给input设置width:100%

以上是关于div中子元素input设置flex无效的主要内容,如果未能解决你的问题,请参考以下文章

解决flex布局导致子元素的宽度无效的问题

CSS中Flex布局控制每row的元素数量(没行3个)的问题

flex布局怎么设置其中元素的宽度

flex布局怎么设置其中元素的宽度

HTML布局元素的分类都有哪些?每种布局元素的应用场景?

如何在媒体查询设置的流体布局中垂直和水平居中子元素?