css - 响应问题 : image (float left) and div -> image (center) and div under

Question

我有一个小问题。我有一个带有 float: left; 的图像，然后是一个带有文本的 div。结果是这样的:https://css-tricks.com/wp-content/csstricks-uploads/web-text-wrap.png

太棒了。但是当屏幕变小的时候，最后，因为图片只有250px大，左边是图片，右边是几个字。我想在图像下“推”带有测试的 div 并同时将图像居中:当屏幕大时，例如 400px。

我该怎么做!？这似乎很容易，但我尝试过的所有教程或代码笔都让我感到困惑......

谢谢

Answer 1

研究 media tags我认为它们正是您要找的。

所以你的 css 应该是这样的:

@media all (width: 400px){
    .image{
        ...
        margin: 0 auto;
    }
}