将div放在CSS中的居中div周围

Question

我有3个div。中间的＆＃39; div需要以包含元素为中心（一个单独的div，即页面的宽度，基本上），而其他两个div应该位于＆＃39;中间的两侧。格。

这是我到目前为止所尝试的内容，但正如您所看到的，如果左右div在宽度上都没有，那么它们会推动“中间”。中心。

<div class='cont'>
    <div class='name2'>The Man with Six Fingers</div>
    <div class='vs'>VS.</div>
    <div class='name1'>I. Montoya</div>
</div>

.cont{
  position:fixed;
  top:0px;
  width:100%;
  background-color:red;
  text-align:center;
}
.cont >div{
    display:inline-block;
}

http://jsfiddle.net/7TLSa/

解决方案只需要在Webkit中工作，因为这将在移动应用程序中。

Answer 1

我调整了宽度，最小宽度和空白区域以调整其响应速度。这是你正在寻找的吗？

请参阅DEMO

.name1, .name2 {
    width:30%;
    min-width:160px;
    white-space:nowrap;
}