Question

我完全失去了推出视口的东西。

我有<div> s，它应该在整个屏幕上伸展100％，但要做空，我不知道为什么。

我已经在这里乱砍了几个小时，并修复了横向滚动，我在flex-keys样式上填充，这迫使它太宽。删除它会消除滚动，但同时全宽<div> s开始从屏幕右侧停止几个px。

我喜欢某些人的直觉。或者真的如何去追捕问题。

如果您点击进入该网站，我会使用每个元素放置边框 *{ border: 1px solid red; }

因此，如果有人能够立即看到造成问题的原因，那就有所帮助。英雄图像和幻灯片显示的容器<div>似乎超出了视口，但它们被设置为100％，因此我不知道为什么或如何解决它。

我会爱一些善良的眼睛。

https://pottertour.co.uk/index2.html

Answer 1

从以下类中删除填充。

<强> index2.html：524

@media screen and (-webkit-min-device-pixel-ratio: 0) and (min-resolution: 0.001dpcm)
.flex-container {
width: 100%;
/* padding-left: 5px; */
/* padding-right: 5px; */
display: flex;
flex-wrap: wrap;
align-items: center;
margin: auto;
}

<强>样式盒-test.css：414

.flex-container {
width: 100%;
/* padding-left: 5px; */
/* padding-right: 5px; */
display: flex;
flex-wrap: wrap;
align-items: center;
margin: auto;
}

<div>在桌面上转到全屏宽度但不是移动为什么？

1 个答案: