Question

我有一个带有视差滚动效果的bootstrap网站。我喜欢它的外观，除了在一个小屏幕上，它无法对齐。＆＃34;文本结束＆＃34;这些部分并没有随着它的内容而延长。换句话说，自举特征堆叠，而视差部分不垂直延伸以容纳堆叠的内容。我怎样才能解决这个问题？ :( 该网站是实时的，所以你可以查看... http://www.adeninedesign.net/

Answer 1

我似乎已经通过使用表来对齐某些内容来解决问题，以防止它堆叠得太多。我一直在使用子行（子元素）...... 我甚至不确定是否允许这样做。

像这样：

    <div class="row">
        <div class="col-sm-1"></div>
        <div class="col-sm-10 text-left">
            <div class="row">
                <div class="col-sm-4">Content</div>
                <div class="col-sm-4">Content</div>
                <div class="col-sm-4">Content</div>
            </div>
        </div>
        <div class="col-sm-1"></div>
    </div>

相反，这是我的解决方案：

    <div class="row">
        <div class="col-sm-1"></div>
            <div class="col-sm-10 text-left">
                <table>
                    <tr>
                        <td>Content</td>
                        <td>Content</td>
                        <td>Content</td>
                    </tr>
                </table>
        </div>
        <div class="col-sm-1"></div>
    </div>

但是，我很确定通过分配xs列对齐，我可以通过列系统本身解决这个问题吗？也许？我简单地尝试了一下，它没有给我我想要的结果，我把这个尝试罐装起来并且随桌摆走 - 我认为这是骗子的解决方案......

解决在小屏幕上重叠的视差滚动功能

1 个答案: