关于固定定位position: fixed；和横向滚动overflow-x: scroll；无法同时使用的问题

在做项目时遇到一个功能是要把某个盒子固定在底部，并且是要横向滑动的，发现position: fixed;和overflow-x: scroll;同时使用无效，现记录一下解决方法

<style>
  .aaa {position: fixed; bottom: 0; width: 100%; } /*注意:width为100%;是重点，不设置貌似无法实现*/
  .aaa .bbb { display: flex; background: #fff; border-bottom: 0; border: 0; overflow-x: scroll; overflow-y: hidden; }
</style>
<div class="aaa"> <!--把固定定位设置到这层盒子上-->
  <div class="bbb"> <!--把横向滚动设置到这层盒子上-->
    需要滚动的内容
  </div>
</div>