这件事我也办不到。我使用的是react和styled组件,我的对齐/对齐不起作用。
DIV-设置为flex,FLEX-方向为列DIV-标题div DIV-主体div,flex生长设置为1,以便flexbox占据容器的全部高度
现在,身体的flex项占据了整个高度(良好),我试图将内容居中在这个div的中间。我已经尝试了所有的Align/Justify组合,但都不起作用,我不知道为什么。这是我的代码
const Div = styled.div`
display: flex;
flex-direction: column;
min-height: 100vh;
justify-items: center;
& > * :nth-child(2){
flex-grow: 1;
background-color: red;
/* position:relative; */
/* align-self: center; */
}
`
const OuterWrapper = styled.div`
padding: 10vw 1.5rem;
overflow: hidden;
// this is the div that contains content that i want to center
有人知道它为什么不起作用吗?
包装上:
display: flex;
justify-content: center;
align-items: center;