zurb-foundation - Foundation 5 中带有响应式内容列的固定宽度侧边栏？

Question

我从 v3 开始就一直在使用 Foundation，所以我没想到会出现这种困惑。

在这种特殊情况下，我需要一个固定宽度的左列(大 3)，然后是一个流动/响应内容列(大 9)作为其余部分。

<div class="row">

    <div class="large-3 columns" id="sidebar" style="width: 300px">
    sidebar
    </div>

    <div class="large-9 columns" id="content">
    content
    </div>

</div>

问题是，当按比例缩小时，内容列在侧边栏下方环绕/被强制向下(甚至在超过下一个屏幕宽度阈值之前)。我在 #sidebar 中尝试了“固定”和“粘性”类，但它们似乎不会影响这种行为。

如果有一个现有的(Foundation？)解决方案，我不想开始破解 CSS。

Answer 1

很像@naota 的方法，我从 Zurb 得到的回应是破解 css。设置一个绝对定位、固定宽度的侧边栏，然后创建一个左填充的新 div:300px；

就像是:

<div class="row">

    <div id="sidebar" style="position: absolute; width: 300px;">
    </div>

    <div class="large-12 columns" id="content" style="padding-left: 300px">
    </div>

</div>

它的效果出奇地好......对于黑客而言。