页面底部的随机空白区域

页面底部的随机空白区域

本文介绍了页面底部的随机空白区域,但仅限于移动的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

您好我看了几个关于如何从网页中删除空白的stackoverflow问题(请参阅下面的选择),但没有人提供的解决方案对我有任何不同。值得一提的是,当我在手机上查看我的网站时,空白只显示出来。有问题的网站是:及其相应的github repo是:



感谢您的帮助。 :)






$ b



解决方案

它是.degree元素上的CSS,特别是绝对定位。对于手机,请将css更改为以下内容;

  @media屏幕和(最大宽度:640px){
.degree {
最小宽度:100%;
剩下:0;
right:0;
}
}

或者,甚至更好,如下所示;

  @media屏幕和(最大宽度:640px){
.degree {
最小宽度:100 %;
position:static;




$ h $更新

  @media仅限屏幕和(最大宽度:640px){
.degree {
最小宽度:100%;
position:static;
}

.div.degree div.course {
width:auto;
最大宽度:100%;
}
}


Hi I have looked at several stackoverflow questions on how to remove white space from a webpage (see selection below) but noone of the solutions given had any difference for me. The werid thing is that the whitespace only shows up when I look at my site on my mobile. The site in question is: http://moduleplanner.github.io/ and its corresponding github repo is: https://github.com/Moduleplanner/Moduleplanner.github.io

Thanks for the help. :)

Huge White Space At Bottom Of Page

Eliminating white space at bottom of page

CSS White Space At Bottom of Page

Strange space at bottom of page on iOS

current state of whitespace

解决方案

It's your CSS on the .degree element, specifically the absolute positioning. For mobile, change the css to the following;

@media only screen and (max-width: 640px){
 .degree{
   min-width: 100%;
   left: 0;
   right: 0;
 }
}

Or, even better, the following;

@media only screen and (max-width: 640px){
 .degree{
   min-width: 100%;
   position: static;
 }
}

Update

@media only screen and (max-width: 640px){
 .degree{
   min-width: 100%;
   position: static;
 }

 .div.degree div.course{
   width: auto;
   max-width: 100%;
 }
}

这篇关于页面底部的随机空白区域,但仅限于移动的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-31 04:16