英文:
Background Image not covering full page height
问题
我已将背景图片设置给我的<body>标签,但由于某种原因,图片未能填充以与页面上的内容相对应。我的页面底部只是白色空间,没有背景图片。
我尝试更改图片的高度和宽度,以为是高度的问题,但仍然没有效果。然后我尝试使用background-size:cover;,但仍然留下了底部的白色空间。请帮助!
这是我的工作空间链接:https://replit.com/@SRJCEthanWilde/CS50A-Module13-52-JosohamyMendez#find.html
直接链接到我的页面是:
https://cs50a-module13-52-josohamymendez.srjcethanwilde.repl.co/find.html
英文:
I have set a background-image to my <body> tag and for some reason the image is not filling out to correspond with the content on the page. The bottom part of my page is just white space with no background image.
I tried to change the height and the width of the image thinking it was a problem with the height. It still didn't work. I then tried to use background-size:cover; and it still left the white space at the bottom. Please help!
This is the link to my work space: https://replit.com/@SRJCEthanWilde/CS50A-Module13-52-JosohamyMendez#find.html
and the link directly to my page is:
https://cs50a-module13-52-josohamymendez.srjcethanwilde.repl.co/find.html
答案1
得分: 1
你尝试过为gap
使用固定值(例如px
或rem
)吗?
例如:
.grid {
gap: 2rem;
}
@media only screen and (max-width: 1024px) {
.grid {
gap: 1rem;
}
}
@media only screen and (max-width: 425px) {
.grid {
gap: 1rem;
}
}
英文:
Have you tried using fixed values (such as px
or rem
) for the gap
?
For example:
.grid {
gap: 2rem;
}
@media only screen and (max-width: 1024px) {
.grid {
gap: 1rem;
}
}
@media only screen and (max-width: 425px) {
.grid {
gap: 1rem;
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论