我正在尝试使用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。
请注意，当您向下滚动时，导航菜单及其下方的框会向右扩展一点并与主体重叠。此问题仅在我在菜单下方添加了第二个块之后才出现。
我已经阅读了很多有关奇怪的词缀行为的信息，所以也许这只是词缀不是理想解决方案的实例。无论如何，想知道是否有一些明显的问题导致此问题很容易解决。我是一名吉他手，试图做一些基本的编码，我敢肯定我会忽略一些显而易见的东西！
谢谢！
布莱恩