垂直對齊文本中固定寬度的div和浮法

Question

我有一個情況，我需要垂直對齊文本，其具有一個div內：

1. 固定寬度
2. 多行文本
3. 甲float applied

這是一個使用display：table-cell;這將無法工作，因爲沒有浮動，這是我需要：

CSS: 

.noFloat { 
    width:200px; 
    height:200px; 
    border:1px solid black; 
    vertical-align:middle; 
    display:table-cell; 
} 



HTML: 

<div class="noFloat"> 
    Here is some content for my div. Here is some more content for my div. 
</div> 

下面是使用行高的例子：;這將行不通，因爲有其最終被亂七八糟多行文本：

CSS: 

.lineHeight { 
    width:200px; 
    height:200px; 
    line-height: 200px; 
    border:1px solid black; 
} 



HTML: 

<div class="lineHeight"> 
    Here is some content for my div. Here is some more content for my div. 
</div> 

下面是使用顯示的一個示例：表細胞;

CSS: 

.withFloat { 
    width:200px; 
    height:200px; 
    border:1px solid black; 
    vertical-align:middle; 
    display:table-cell; 
    float: left; 
} 


HTML: 

<div class="withFloat"> 
    Here is some content for my div. Here is some more content for my div. 
</div> 

這裏是所有3個例子：http://jsfiddle.net/BJGh5/3/

Answer 1

如果我理解正確的話，你就需要設置一個浮動，不會因爲浮動，在頂部對齊的一切工作集裝箱分區。一個垂直對齊，一個浮動。