浮动右框的宽度为最大宽度

Question

与此处的问题类似：

CSS - Float to max width

我正在尝试＆lt; pic＆gt; /＆lt; info＆gt;样式布局 - 但是如果用户将浏览器调整得更小，我想让这个布局响应。

为此，我需要把＆lt; info＆gt; ＆lt; pic＆gt;上方的框布局中的框，以便当宽度低于某个像素宽度时，我从＆lt; info＆gt;中删除“向右浮动”它应该插在图片框上方。

这是全尺寸布局的JS小提琴：

http://jsfiddle.net/FNwcA/

有没有办法让“Fred”框填充宽度，使其与红色框对齐而不使用精确的像素宽度？

谢谢！

Answer 1

如果图片div位于info div之前，则可以将其left浮动，然后根据视口宽度（使用media queries）将其删除。 DEMO

正如accepted answer to the linked question所说：

  

当你想要它时，漂浮一些东西没有多大意义   展开以填充父