修复桌面上 div 的移动视图

Question

我有这样的小部件：

<div class="col-md-12 col-xs-12">
    <div class="col-md-4 col-xs-12">
        1
    </div>
    <div class="col-md-4 col-xs-12">
        2
    </div>
    <div class="col-md-4 col-xs-12">
        3
    </div>
    <div class="col-md-4 col-xs-12">
        4
    </div>
</div>

我像这样嵌入上面的小部件

<div class="container">
    <div class="col-md-12">
        <div class="col-md-3 embedWidget">
            <!-- embeeded-widget-comes-here -->
        </div>
        <div class="col-md-9">
            <!-- some other imp content here -->
        </div>
    </div>  
</div>

当我这样做时，我的小部件显示为 4 列网格，但我希望它是堆叠格式（移动视图 col-xs），适用于所有响应宽度

我怎样才能实现它

我尝试将宽度 100% 设置为 embedWidget（该区域的内容固定为 4 列网格）

Answer 1

为什么不在 embedWidget 上设置 100% 宽度以用于较小设备的媒体查询。