css - 仅当剩余宽度至少为 x 像素时才 float 元素

Question

我有一个元素，其宽度事先未知，我想将其 float 到左侧，但前提是它在右侧为某些文本留下至少 x 的空间。试过这样的事情:

#image { float: left }
#text  { min-width: 30em; }

<img id="image" src="...>
<p id="text">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>

但这不起作用，因为#text 的宽度被认为包括 float 。

如何使 float 以其右侧的空间量为条件？

Answer 1

使用响应式/自适应设计，并使用 css3 @ media screen 在不同的屏幕分辨率下以不同方式排列元素

@media only screen and (min-width: 760px) and (max-width: 1280px) { 
    .classname { 

    }
}