问题描述：div等块级元素默认宽度为100%，当页面渲染完后其宽度已经固定，这时候如果文字超出其宽度后会出现滚动条，这时超过原宽度的部分背景可能跟div定义的背景色不一样；
解决方式：给最外层div添加样式：
min-width: max-content;
解决之后效果如图下所示：
扩展：max-content 和fit-content， 当元素内容没有超出行宽的时候，最终的宽度都是内容的宽度。而超出行宽的时候，max-content的表现是不换行，出现横向滚动条，fit-content的表现是会换行