Flex布局有哪些常见陷阱

容器的属性不正确：在使用Flex布局时，需要注意设置容器的属性，如display:flex;，flex-direction，align-items等，确保容器的布局是按照需求正确设置的。

子元素的属性不正确：同样需要注意设置子元素的属性，如flex-grow，flex-shrink，flex-basis等，以确保子元素的布局是按照需求正确设置的。

不熟悉Flex布局的属性：Flex布局有很多属性，如flex-grow，flex-shrink，flex-basis，justify-content等，需要熟悉这些属性的用法，以便正确地使用Flex布局。

不考虑跨浏览器兼容性：不同浏览器对Flex布局的支持程度可能有所不同，需要注意考虑跨浏览器兼容性，确保在不同浏览器中都能正确显示。

忽略默认的Flex属性：在Flex布局中，子元素默认会设置为flex: 0 1 auto;，如果不清楚这个默认属性，可能会导致布局出现问题。

不考虑响应式设计：Flex布局可以很好地支持响应式设计，但是如果不考虑响应式设计，在不同屏幕尺寸下可能会出现布局问题。

忽略嵌套Flex布局：Flex布局支持嵌套，可以实现更复杂的布局效果，但是如果忽略了嵌套Flex布局的使用，可能会限制布局的灵活性。