css – 如何在同一行上排列3个div？

有人可以帮助我这个问题，因为我一直在处理它很长时间了….

我试图得到3个divs在同一行上彼此相邻的一个divs看起来像这样：

<div>  
  <h2 align="center">San Andreas: Multiplayer</h2>  
  <div align="center">
    <font size="+1">  
      <em class="heading_description">15 pence per slot</em>  
    </font>  
    <img src="http://fhers.com/images/game_servers/sa-mp.jpg" class="alignleft noTopMargin" style="width: 188px; ">  
    <a href="gfh" class="order-small">  
      <span>order</span></a>  
  </div>

和其他两个是相同的div，请帮助我得到所有三个div在同一行一个在右边一个在中间和一个在左边

解决方法

我很惊讶，没有人提供CSS表布局作为解决方案。

看看Working Demo

纯CSS 2.1，跨浏览器(IE8)

HTML：

<div class="Row">
    <div class="Column">C1</div>
    <div class="Column">C2</div>
    <div class="Column">C3</div>
</div>

CSS：

.Row
{
    display: table;
    width: 100%; /*Optional*/
    table-layout: fixed; /*Optional*/
    border-spacing: 10px; /*Optional*/
}
.Column
{
    display: table-cell;
    background-color: red; /*Optional*/
}