我正在尝试均匀地间隔这个布局,它基本上就像卡片布局。我很困惑为什么尽管做了 justify-content: space- Between 或 space-evenly 但它没有间距。我希望“其他”的间距均匀。
这是我的 JSX
<section className="skills-wrapper">
<div className="content-wrapper">
<h1>Tech-Stack</h1>
<div className="container">
<div className="title">
<h2>Web Development</h2>
<div className="box">
<div className="name">
</div>
</div>
</div>
<div className="title">
<h2>Software Development</h2>
<div className="box">
<div className="name">
</div>
</div>
</div>
<div className="title">
<h2>Others</h2>
<div className="box">
<div className="name">
</div>
</div>
</div>
</div>
</div>
</section>
这是我的 CSS:
.skills-wrapper{
width: 100%;
height: 100vh;
background: #CCD6F6;
}
.content-wrapper{
width: 100%;
max-width: 75.5em;
padding: 1.875em;
margin: 0 auto;
}
.content-wrapper h1{
font-size: 2rem;
color: #E1065E;
padding: 0.524em 0;
}
.container{
background: #999;
display: flex;
justify-content: space-between;
align-items: center;
}
.container .title{
display: flex;
width: 100%;
}
我尝试回溯并再次执行,但我仍然无法弄清楚。谁能帮帮我吗?我迷路了
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
从
.container .title选择器中删除width: 100%;。.container .title { display: flex; /* width: 100%; */ }