当屏幕调整大小时，背景色不会应用到屏幕外的部分。如果我错过了什么，请指导我...
全屏
调整屏幕大小时不太好
这是我的代码块;
<div style={{ paddingLeft: '40px', width: '90%' }}>
<div style={{ overflowX: 'scroll' }}>
<div style={{ backgroundColor: '#DAFAE8' }}>
<div style={{ display: 'flex'}} >
<Box style={{ width: '40px', minWidth: '40px' }}><Checkbox /></Box>
<Box style={{ width: '80px', minWidth: '80px'}}>Success</Box>
<Box style={{ width: '300px', minWidth: '300px'}}>Title goes here with variable length...</Box>
<Box style={{ width: '100px', minWidth: '100px'}}>2023-03-18</Box>
<Box style={{ width: '120px', minWidth: '120px'}}>Andrew, John</Box>
<Box style={{ width: '120px', minWidth: '120px'}}>Main street</Box>
<Box style={{ width: '100px', minWidth: '100px'}}>Another field</Box>
</div>
</div>
</div>
</div>
1条答案
按热度按时间unguejic1#
背景色似乎没有应用于可滚动容器的整个宽度。解决此问题的一种方法是在可滚动容器本身上设置背景色，而不是在其子元素上设置背景色。
下面是代码块的更新版本：
通过在可滚动容器上设置背景色，颜色将应用于容器的整个宽度，包括由于滚动而当前不在屏幕上的任何部分。