在其他居中div的旁边添加div [英] Add div next to other centered div

问题描述

我想在位于中心的其他div的右侧添加一个div。如图所示：

I want to add a div to the right of other div which is positioned in the center. As shown in the image:

我目前有这个html：

I have this html so far:

<div id= "top-menu-wrapper">
  <div id="top-menu">       
  </div>
  <div id="social">
  </div>
</div>

css：

#header #top-menu {
    display           : inline-block;
    width             : 764px;
    height            : 55px;
    margin            : auto;   
}

#header #social {
    display           : inline-block;
    width             : 100px;
    height            : 55px;   
    margin-left       : 25px;

}

#header #top-menu-wrapper {
    display           : block;
    text-align        : center;
    margin-bottom     : 25px;
}

推荐答案

或者，如果你的容器是流体的，把有问题的div放在里面宽度为

Or, if your container is fluid, center the problematic div inside a right-floated subcontainer with the width of

（顶部容器宽度 - 中央div宽度）/ 2）的右侧浮动子容器

如果使用JavaScript窗口resize listener重新计算每个resize事件的位置，你可能会看起来最好。 （虽然你宁愿只使用CSS，我建议JS的最好的结果）

You'll probably make it look the best if you use the JavaScript window resize listener to recalculate its position on every resize event. (although you'd prefer to use CSS only, I'd suggest JS for the best results)

这篇关于在其他居中div的旁边添加div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！