php - 固定列布局 bootstrap 3

Question

我很好奇，一直在到处寻找。我正在尝试创建一个三列布局，其中左列和右列是粘性的，而中间列不是粘性的。我已经尝试将 data-spy="affix"添加到我的代码中，甚至设置一个偏移量，我可以让左列变得粘稠，但是添加 dataspy 时右列似乎嵌套在左列中。

代码如下:

<div class="container-fluid">
    <div class="row-fluid">
        <div class="well span2"><?="Left Column";?></div>
        <div class="well span8"><?="Center Column";?></div>
        <div class="well span2"><?="Right Column";?></div>
    </div>
</div>

此外，如果您想知道为什么它看起来很有趣，稍后内联 PHP 代码将包含一些 php 脚本...

编辑

CSS 代码

.stick_r {
    position:fixed;
    right:10px;
}
.stick_l {
    position:fixed;
    left:10px;
}

HTML代码

<div class="container-fluid">
    <div class="row-fluid">
        <div class="well span2 stick_l">Left Column</div>
        <div class="well span8">Center Column</div>
        <div class="well span2 stick_r">Right Column</div>
    </div>
</div>

看起来 Center Column 位于 Center Column 的下方。偏移时它看起来很靠右。

代替

Answer 1

我在

找到了答案

http://bootply.com/101100

<div class="sidebar-nav-fixed pull-right affix">

代替:

<div class="well span2">

对于每个侧边栏。