css – 浮动div的垂直中心内容

我如何将浮动div的内容(我不知道的高度)定位在哪里？

有非常简单的HTML和CSS(见这个小提琴：http://jsfiddle.net/DeH6E/1/)

<div class="floating">
    This should be in the middle
</div>
​
.floating {
    height: 100px;
    float: left;
    border: 1px solid red;
    vertical-align: middle;
}   ​

如何使句子“这应该在中间”出现真的在中间(垂直居中)？ vertical-align：middle似乎没有工作.我试过显示：table-cell,它也没有工作.解决这个问题的最好方法是什么？我想避免插入任何其他HTML标签,只需通过CSS.

(只是为了说明：我不知道容器的实际高度,100px仅仅是为了这个例子)

编辑：我想让你理解我,所以…总是在设计网页的时候,我遵循HTML的内容规则,CSS负责视觉风格.我从来不把它们混在一起,或者用一个只是为了使另一个.在这种情况下,我也想坚持这个规则.我不想为CSS插入HTML元素.

解决方法

其他的是正确的,you need to nest two DOM elements这给了你更多的选择控制中心.