**已关闭。**此问题需要debugging details。当前不接受答案。
编辑问题以包含desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem。这将有助于其他人回答问题。
8小时前关门了。
Improve this question
我正在创建的一个website在移动的上遇到了一个问题,进度部分没有填满屏幕。您能帮助我吗?该网站的github链接在这里:https://github.com/mooshteam/moosh:)
我试着改变风格,但还是找不到问题所在。我可能还是错过了一些东西!
当你缩小它看起来像这样,我如何让它充满整个屏幕?[1]:https://i.stack.imgur.com/7lhMM.jpg
1条答案
按热度按时间gcuhipw91#
这里的问题是你的奶牛标志。它包含在你的flexbox中,由于
padding: 70px 20% 0
属性,它只允许占用你的viewport宽度的60%。这个标志被允许占用550px
,这是没有问题的,因为你已经指定了500px
的HTML内联宽度和高度属性。但是,这意味着徽标没有响应,并且占据了Flexbox旁边的空间,将页面宽度推过了视口。这个问题可以通过使用响应CSS属性来解决,如果你从logo中移除内嵌HTML的width和height属性,并将
max-width
设置为100%,那么奶牛现在会占据flexbox中剩下的空间,你的页面也不会溢出。也就是说,考虑改变移动的视口的
flex-direction
,并继续考虑responsive mindset。