第二列中心按钮宽度是否灵活？

Question

如何将#top-menu内的红色和黄色蓝色按钮居中？

http://jsfiddle.net/qhoc/qKXD2/

我的问题是我希望#top-menu保持在右侧而不是与整个屏幕宽度重叠。现在#top-menu内的任何内容都是屏幕本身的中心。

感谢。

Answer 1

更改＃top-menu .center和#logo样式，我认为这就是你想要的

#logo {
  background-color: yellow;
  display: block;
  float: left;
  width: 180px;
  height: 45px;
  position:absolute;
 }


#top-menu .center {
  width: 235px;
  margin auto;
}

DEMO

Answer 2

从按钮样式中删除float:left并添加display:inline-block. 将overflow:auto添加到#top-menu .center

解释

Float:left：使你的div与父div完全对齐。

disply:block:使div占据整个水平空间。

Overflow:auto：根据ot。

中的内容使父div扩展

由于你需要将两个div放在一起，然后给inline-block。 inline-block使div基于div内的内容进行扩展。

<强> LIVE DEMO

Answer 3

这是解决方案。删除徽标中的浮动并放置margin：0 auto;请参阅以下链接

http://jsfiddle.net/qKXD2/6/

非常感谢

Answer 4

检查demo中心徽标和标题顶部菜单。