<分区>
我在导航和搜索按钮之间有一个 Logo ，我想将 Logo 置于页面中央。使用水平自动边距会使中心 div 向右移动，因为左侧的内容更大。
.flexbox {
display: flex;
}
.logo {
margin: 0 auto;
}<div class="flexbox">
<div class="left-nav">
<a href="#">Link1</a>
<a href="#">Link2</a>
<a href="#">Link3</a>
<a href="#">Link4</a>
<a href="#">Link5</a>
<a href="#">Link6</a>
<a href="#">Link7</a>
<a href="#">Link8</a>
</div>
<div class="logo">
Logo
</div>
<div class="right-search">
search
</div>
</div>最佳答案
为您的 CSS 尝试这个。
它使 div 在显示器上具有一定的宽度，并使 Logo 文本居中。
.flexbox {
display: flex;
}
.left-nav{
width:25%;
}
.logo {
width:50%;
text-align: center;
}
.right-search{
width:25%;
}<div class="flexbox">
<div class="left-nav">
<a href="#">Link1</a>
<a href="#">Link2</a>
<a href="#">Link3</a>
<a href="#">Link4</a>
<a href="#">Link5</a>
<a href="#">Link6</a>
<a href="#">Link7</a>
<a href="#">Link8</a>
</div>
<div class="logo">
Logo
</div>
<div class="right-search">
search
</div>
</div>关于html - CSS Flexbox - 在两个 div 之间居中一个 div，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/51112493/