我想知道如何证明justify-content: space-betweenflexbox 允许有多少空间。
目前,我的项目之间是有间隔的,但是它们之间的空间太大了,我希望它们之间只有一点空间,以便它们可以连续摆在中间。
下面的代码片段有望阐明我正在努力解决的问题。
让我知道您是否需要我进一步澄清。谢谢!
#qwrapper {
display: flex;
height: 100%;
width: 100%;
align-items: center;
justify-content: center;
}
.row {
flex: 0 auto;
height: 100px;
margin: 0;
}
#lighticon {
padding-bottom: 30px;
}
@media (max-width: 800px) {
#qwrapper {
flex-direction: column;
align-items: center;
}
}
@media screen and (max-width: 480px) {
#qwrapper {
flex-wrap: wrap;
}
.row {}
}
@media only screen and (min-width: 760px) {
#qwrapper {
justify-content: space-between;
margin: 10px;
}
#lighticon {
position: relative; …Run Code Online (Sandbox Code Playgroud)目前我正在尝试使用flexbox将我的列设置为中心,但是当我调整浏览器大小时它会粘在左侧.我已经尝试过对齐内容中心和对齐项目中心,但我可能不会将它们放在正确的位置.如果有人知道如何解决这个问题将非常感激!谢谢!
.wrap{
display:flex;
}
main{
flex:1;
display:flex;
}
aside, article{
padding:2em;
}
aside{
flex:1;
}
article{
flex:1;
}
@media (max-width: 800px) {
main {
flex-direction: column;
}
}Run Code Online (Sandbox Code Playgroud)
<div class="wrap">
<main>
<aside>
<h1>Do You Want to...</h1>
<ul>
<li>Rebrand myself online</li>
<li>Take my current website and make it modern</li>
<li>Find a way to make information more accessible for customers</li>
<li> Improve customer service</li>
<li> Reach a wider range of people</li>
</ul>
</aside>
<article>
<h1>Do You Want to...</h1>
<ul>
<li>Create forms and …Run Code Online (Sandbox Code Playgroud)