来源订购小屏幕上的列

Question

this is the site， 当我重新调整到小屏幕时，它看起来像这样：

我需要将第二个黄色块替换为底部块，我无法通过粉底拉动和完成它完成它。推送选项

有什么建议吗？

Answer 1

如果我理解正确，您希望最终产品看起来像这样：

您想要更改的行的当前顺序是DEAD MAIN'S CACHE（文本），BENJAMIN（Portrait），然后PROTECT YOUR NECK（Coffee Bean？）。

切换DEAD MAIN'S CACHE（文本）并保护你的颈部（咖啡豆？）。

删除对small的所有引用，并使用push和pull来更正大屏幕的顺序。

您当前的代码：

<div class="row">
    <div class="small-12 small-push-12 large-4 columns">DEAD MAIN’S CACHE (Text)</div>
    <div class="large-4 columns">BENJAMIN (Portrait)</div>
    <div class="small-12 small-push-12 large-4 columns">PROTECT YOUR NECK (Coffee Bean?)</div>
</div>

我的建议：

<div class="row">
    <div class="large-4 large-push-8 columns">PROTECT YOUR NECK (Coffee Bean?)</div>
    <div class="large-4 columns">BENJAMIN (Portrait)</div>
    <div class="large-4 large-pull-8 columns">DEAD MAIN’S CACHE (Text)</div>
</div>

本质上，首先设计移动设备，然后使用推/拉来“修复”更大的屏幕尺寸。

如果我误解了你的问题，请告诉我。

我希望有所帮助。