3
我想要我的文本居中水平和垂直柔性项目。我环顾四周,并尝试了很多东西,但迄今为止似乎没有任何工作...垂直和水平弯曲项目中心p
我可以嵌套另一个flexbox-容器内的现有?
html, body {
height: 100%;
margin: 0;
}
.flex-container {
height: 100%;
display: flex;
flex-direction: column;
}
.page1 {
flex-grow: 1;
min-height: 100%;
background: lightblue;
}
#text1 {
font-size: 160%;
color: white;
font-family: roboto, sans-serif;
}
.page2 {
flex-grow: 1;
min-height: 100%;
background: cyan;
}
.page3 {
flex-grow: 1;
min-height: 100%;
background: lightgreen;
}
.page3 {
flex-grow: 1;
min-height: 100%;
background: lightgreen;
}
<div class="flex-container">
<div class="page1">
<p id="text1">blabla bla blablabla.</p>
</div>
<div class="page2"></div>
<div class="page3"></div>
</div>
是的,你可以嵌套Flex容器。 http://stackoverflow.com/a/33049198/3597276 –