html - 如何垂直对齐这两个 div？

Question

在this jsFiddle , 如何垂直对齐图像和文本？

HTML:

<div class="step_div">
    <div class="step_div_inner">
        <div class="step_div_inner_image">
            <img src="http://i.imgur.com/TasZn.png">
        </div>
        <div class="step_div_inner_text">
            here is some text here is some text here is some text here is some text here is some text here is some text 
        </div>
    </div>
</div>​

CSS

.step_div_inner_text {
    font-size:18px;
    width:460px;
    line-height:24px;
    position:relative;
    left:5px;
    bottom:14px;
    display:inline-block;
}
.step_div_inner_image {
    display:inline-block;
}
.step_div {
    padding:20px 0;
}
.step_div_inner {
    width:574px;
    margin:0 auto;
}​

Answer 1

你可以像这样使用 float :

http://jsfiddle.net/xH2da/10/

您只需确保在需要时清除它们。