[英]How do I center a text above a section in flex display mode
I trying to center the text "Game Over" above the 3*4 grid我试图将文本“Game Over”居中在 3*4 网格上方
css code CSS代码
* {
padding: 0;
margin: 0;
box-sizing: border-box;
}
body {
font-family: 'Lato', sans-serif;
height: 100vh;
display: flex;
align-items: center;
background-image: linear-gradient(to right top, #9200ff, #8c1cf8, #8729f0, #8232e8, #7e39e0);
}
.memory-game {
width: 640px;
height: 640px;
margin: auto;
display: flex;
flex-wrap: wrap;
perspective: 1000px;
}
(stack overflow is giving me not enough description so this is some lorem ipsum) (堆栈溢出没有给我足够的描述,所以这是一些 lorem ipsum)
As you have given display: flex
to body, try to change the flex direction for body.正如你给了
display: flex
to body 一样,尝试改变 body 的 flex 方向。 For example -例如 -
* {
padding: 0;
margin: 0;
box-sizing: border-box;
}
body {
font-family: 'Lato', sans-serif;
height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
background-image: linear-gradient(to right top, #9200ff, #8c1cf8, #8729f0, #8232e8, #7e39e0);
}
.memory-game {
width: 640px;
height: 640px;
margin: auto;
display: flex;
flex-wrap: wrap;
perspective: 1000px;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.