html - 不使用 float 的按钮旁边的多行文本

Question

我想在不使用 float 的情况下以多行显示大按钮旁边的一些文本。

这是我的代码

<div>
    <button>Boton</button>
    <p>asasd asd asdasdas dsadasdas dasd sdsfasdasd sadsadas da sdasdasdasd asdasdasdasd dassda sdasdasd</p>
</div>

和这个 CSS:

div{
    background: red;
    width: 100%;
}

button{
    height: 200px;
}

p{
    display: inline;
}

http://jsfiddle.net/dbZB2/

我想看这样的 http://img13.imageshack.us/img13/8343/capturaft.jpg

这可能吗？

Answer 1

您将不得不添加一些宽度并尝试使用 inline-block 而不是 inline。

jsFiddle

注意:IE7 和更早版本不支持 inline-block，所以要小心。对于较旧的 IE 版本，您可以使用 *display:inline;zoom:1;