我正在尝试使用有序列表 (ol) 创建指令列表。在内部，我希望说明的文本向左浮动，显示步骤的图像向右浮动。
我试过像这样将内容包装在列表项 (li) 中:
<ol>
<li><p style="float:left">Follow these instructions</p><img style="float:right" src="[***]" alt="" /></li>
</ol>
这只是将图像发送到 li 元素之外。我尝试在 li 中的两个 float 元素之后添加一个清除 div，我尝试向 li 元素本身添加一个清晰的 hack。我还尝试过将 p 和 img 元素嵌套在 float div 中。
这可能吗？想使用这种方式，但如果没有，将生成一些其他解决方案。
最佳答案
您还可以考虑使用overflow: hidden technique ;将 overflow: hidden 添加到您的 li 将使它能够扩展以包含 float 内容。
关于css - 列表元素内 float 元素的技巧，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/3104759/