问题描述(如图):div等块级元素默认宽度为100%,当页面渲染完后其宽度已经固定,这时候如果文字超出其宽度(如调用api后显示的结果),我们如果希望其出现滚动条,这时超过原宽度的部分背景可能跟文字背景不一样。
如图:1,初始情况2,点击菜单后出现的文字长度超出原div宽度,出现了滚动条
(注意设置overflow: scroll才会出现滚动条,如果设成hidden超出的文字会被隐藏)3,向右拉滚动条发现背景没铺满
解决方式:
给最外层div加样式:min-width: max-content;min-width: -moz-max-content;
说明:注意是min-width而不是width,不然会出现其它错误。
解决后的样子: