网站侧边栏内容离开侧边栏

Websites sidebar content going off the sidebar

这是怎么回事(边栏在右边,我只是把它放在那里以可视化问题 screenshot of website

那么我如何才能阻止这种情况发生呢,这里是下面的 CSS 和 HTML 代码

HTML

<div class="sidebar">
    aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaabbbbbbbbaaaaaaaaaaaa
  </div>
  <footer>Copyright &#169; Hot Beans 2028</footer>
</html>

CSS

.sidebar {
    background: rgb(5,68,104);
    position: fixed;
    top: 0;
    left: 0;
    width: 20%;
    height: 100%;
    padding: 20px 0;
    transition: all 0.5s ease;
}

也许你可以使用 word-wrap

word-wrap: break-word;

像这样