CSS：三个背景图像链接：浮动一个极左，一个极右，一个中心？

Question

我想使用CSS为一系列博客文章构建导航布局，每篇博文都是卡通系列的一章：

<div with 500px width>-------------------------
-----------------------------------------------
-----------------------------------------------
<div>
<<previous          +more                >>next
</div>
</div>

'previous'，'next'和'more'都是空的div（但可能是跨度），宽度为50px，应用了背景图像。他们链接到相关的地方。

我正在使用CSS sprites来创建漂亮的悬停效果，这也意味着我不能轻易地改变每个链接的宽度而不会弄乱精灵。

对于我的生活，我无法弄清楚如何设置三个div的样式以使'previous'浮动极左，'more'浮动中心，'next'浮动右。

有人可以帮忙吗？

感谢。

---

Answer 1

您能否定义边距，因为我假设容器div总是500？

类似

<div style="width: 500px">
<div style="float: left;">Previous</div>
<div style="float: left; margin-left: how ever many pixels it takes to center;">more</div>
<div style="float: right;">Next</div>
</div>

Answer 2

.previous {
  width: 50px;
  float: left;
  background-position: left; 
}
.more {
  width: 400px;
  float: left;
  background-position: center;
}
.next {
  width: 50px;
  float: left;
  background-position: right; 
}