Css 调整窗口大小会在使用媒体查询时中断浮动行为吗？

我有一个我正在工作的网站，在

下面是我看到的行为示例（使用与布局相同的css代码）。如果你玩一下结果面板的大小，你可以看到我在说什么

我知道我可以使用javascript监控页面的宽度，并根据需要在内部元素中添加或删除
.left
类，但我认为这不是最优雅的解决方案。有人遇到过这样的问题吗？
媒体查询在我这边起作用：在600像素以上，它会启动，并大声说它被忽略了；您期望的行为是什么？返回到600px以下时，span元素应上升到与主链接文本一致的位置，浮动到元素内部的左侧。较小宽度的屏幕应显示为“BarFoo”，较宽的屏幕应显示为“Foo Bar”