Div对齐错误：右手中间对齐

我想要有两个div的集中，左对齐好吧，右手对齐中间，我不明白为什么右手对齐像这样。Div对齐错误：右手中间对齐

#pageWrapper 
{ 
    /* display: flex; */ 
    /*justify-content: center;*/ 
    text-align: left; 
    padding: 50px; 
    display: inline-block; 
} 

#navbar 
{  
    width: 180px; 
    margin-right: 10px; 
    opacity: .8; 
    display: inline-block; 
} 
<div id="pageWrapper"> 
    <div id="topBar"> 
    ----- navbar stuff goes in here 
    </div> 

    <div style="width: 700px; display: inline-block; margin: 0;"> 
    ----- topbar goes in here 
    </div>

测试地点：here

来源

2017-05-06 Paul Morriss

你想下方的“东西放在这里”格去了吧？ – Edward

你能画一幅你想要的样子吗？ –

@爱德华是的，第二次潜水应该是正确的，理想情况下，如果我缩小了浏览器，它会在左边下一个 –

从我在你的网站看你有没有在这个div：

<div style="width: 700px; display: inline-block; margin: 0;"> 
    ----- topbar goes in here 
</div>

你有一个浮动一个div：离开了。您需要将其更改为float：right然后div会看起来居中，因为您的宽度为：700px。

将其更改为更宽的div，div将移动到右侧。

要看到它实际上是正确的，而不是中心，你应该宽度更改为类似：

<div style="width: 80%; display: inline-block; margin: 0;"> 
    ----- topbar goes in here 
</div>

来源

2017-05-06 22:07:20

float：left？ –

给出右列“float：right”的父div似乎可以解决问题。但它没有'float：left'。它根本没有“浮动”规则。 –

@Michael_B和Ziv，谢谢你。如果我使屏幕闪烁，它现在移动到顶部的块（wahoo）下面，但居中对齐，是否有办法阻止它？ –

充分利用width: 50%两个盒子。

这是你的结果：

来源

2017-05-06 22:29:01 Edward

Div对齐错误：右手中间对齐

回答

相关问题