CSS如何對齊div中的元素與2列

Question

在我的html/css測試頁面中，我有一個帶有2列的div容器。 我的問題是，如果我在頂部邊距或邊框的左列中插入div，右列中的div未在頂部對齊，但受左列中div的影響，我無法理解爲什麼。

CSS

body { 
font-family: Arial, Helvetica, sans-serif; 
font-size: 12px; 
background-color: #f5f6f7; 
} 

.container { 
width: 960px; 
margin-left: auto; 
margin-right: auto; 
} 

.row { 
margin-top: 10px; 
background: #fff; 
} 

.row:before, .row:after { 
display: table; 
line-height: 0; 
content: ""; 
} 

.row:after { 
clear: both; 
} 

.footer { 
height: 36px; 
line-height: 36px; 
} 

[class*="span"] { 
min-height: 1px; 
margin: 0px; 
} 

.span1 { 
width: 958px; 
display: table-cell;  
} 

.span2 { 
width: 699px; 
display: table-cell; 
} 

.span3 { 
width: 258px; 
display: table-cell; 
} 

.span3.dark { 
background: #616161; 
} 

.content-center { 
padding: 0px; 
} 

.a { 
background:#FF0000; 
border: 5px solid #00FF00; 
margin-bottom: 10px; 
} 

.b { 
background:#FF8040; 
border: 1px solid #00FF00; 
} 

HTML

<div class="container"> 

<div class="row"> 

<div class="span2"> 

    <div class="content-center"> 
     <div class="a">LEFT PANEL <br /><br /><br /><br /><br /><br /></div> 
    </div> 

</div> 

<div class="span3 dark"> 

    <div class="content-center"> 
     <div class="b">RIGHT PANEL <br/> Why it is not aligned at the top ?</div> 
    </div> 

</div> 

</div> 

</div> 

我怎樣才能解決我的問題？感謝

CSSDECK example

Answer 1

我從來沒見過的發車位置這種風格。 什麼都如此。

這樣做：

.span3 
{ 
    vertical-align: top; 
}