1

我正在尝试使用 JS Affix 将侧边栏列中的 2 个块固定在页面上。

滚动时，侧边栏的宽度会扩大一点，扩大的部分与主体列重叠。

我曾尝试手动设置 div 宽度并使用百分比，但我所做的所有更改最终都具有相同的行为。

以下是相关代码：

<div class="menu block tile-default" id=sidebarmenu" data-spy="affix" data-offset-top="195" data-offset-bottom="300" style="border:0px;">
                <img src="/img/sidebar-top.png" class="img-responsive" alt="sidebar image">
                <div class="pad">
                    <ul class="nav nav-pills nav-stacked">
                        @include('partials/menu')
                    </ul>
                </div>
                <div style="background-color: white; height: 10px; border:0px"></div>
                <div class="pad" style="border: 4px solid orange; background-color: #1d6899; color: ghostwhite">
                    <a href="https://zoom.us/webinar/register/Pt9LgDTBR828OXIHOfTLPQ" class="thumbnail" target="_blank">
                        <img class = "img-responsive" src="/img/img.png" alt="...">
                        <div class="caption">
                            <h5 class="text-center">Some Caption</h5>
                        </div>
                    </a>
                </div>
            </div>

你可以在这里看到我在说什么：

https://guitar-dreams.com/guitar-lesson/triad-arpeggios-2-strings/20

在那里也可能更容易遵循 CSS。

请注意，当您向下滚动时，导航菜单及其下方的块会向右扩展一点并与主体重叠。此问题仅在我添加菜单下方的第二个块后才出现。

我已经阅读了很多关于奇怪的词缀行为的文章，所以也许这只是词缀不是理想解决方案的例子。无论如何，想知道是否有一些明显的问题导致这个问题很容易解决。作为一名吉他手，我正在尝试做一些基本的编码，我确信我忽略了一些明显的东西！

谢谢！

布赖恩

4

0 回答 0