美文网首页
网页页面内容消失-右边成“白带”问题

网页页面内容消失-右边成“白带”问题

作者: 斯空拂 | 来源:发表于2020-06-29 22:00 被阅读0次

今天写网页缩小浏览器时,发现一个很恶心的问题。绝对定位模块左边缺失,导航条和下方相对定位模块的右边成了“白带”。

左边 右边

有问题咱就解决呗,于是我开始了漫漫探索道路。

我首先想到的是浮动问题。顶部盒子中有左浮动和右浮动,莫非导航栏的ul需要浮动一下,而下面的大盒子中再嵌套一个同样大的盒子浮动一下?已有知识点给我的感觉应该不行,但是,实践才是检验真理的唯一标准,好吧还是不行,那就继续下一个想法。

然后我想到的是宽度问题。所有的外部盒子我都没有设置宽度,按理来说是可以的。然后我就把外部大盒子宽度设置成width = 100%。同样,还是没有效果。

解决方案:

最后想不出来就只能寻求万能的百度了:

浏览器窗口缩小,div宽度就会自适应,其中原因我不太理解。

而给body设置一个min-width,并且大于所有居中div的width,就会使得缩小后的浏览器中,网页以最小宽度显示。浏览器窗口拉大到大于min-width时,左右两边内容均等出现。

居中盒子 body设置 左边内容 右边内容 浏览器窗口大于min-width时的内容

相关文章

  • 网页页面内容消失-右边成“白带”问题

    今天写网页缩小浏览器时,发现一个很恶心的问题。绝对定位模块左边缺失,导航条和下方相对定位模块的右边成了“白带”。 ...

  • 使用html2canvas导出pdf截图不全问题解决方案——经测

    项目中遇到一个问题,要将网页内容导出成pdf,但是如果页面有滚动条,且上下滑动了页面,导出的pdf只有一部分,影响...

  • ios下微信h5页面弹出键盘会把页面顶上去下不来问题

    问题:当我们在微信开发网页在ios下弹出键盘时会把页面给顶上去,当键盘消失页面看似下来了,实则并没有导致页面点不动...

  • 20160910------JAVAWEB概述

    1、web应用程序 2、静态页面、动态页面 静态页面:网页中内容固定,不会更新。(HTML、CSS) 动态网页:网...

  • WKWebView 缓存策略

    问题描述 今天遇到一个问题,网页加载的页面,服务器数据提交更新了,但是 iOS 这边显示的还是老的内容。页面使用的...

  • 爬虫之路-1

    2018/1/21 第一次 爬取拉钩一级页面 1. 分析拉勾网页面 拉勾网页面使用ajax技术,so,页面内容...

  • 自己动手实现一个前端路由

    单页面应用利用了JavaScript动态变换网页内容,避免了页面重载;路由则提供了浏览器地址变化,网页内容也跟随变...

  • iOS runtime 应用场景

    class_addMethod应用场景 如上图,右边弹出的一个毛玻璃视图,点击非玻璃区,毛玻璃页面从右边消失。这个...

  • 从Ajax中获取数据

    对网页有些了解的朋友应该都知道并不是所有网页的页面内容都在页面源码中,大多数网页源码中只有页面结构而无数据,显示的...

  • ajax

    新增标签:1: 内容从网页右边到左边 匀速运动,网页刷新重新开始 2:o...

网友评论

      本文标题:网页页面内容消失-右边成“白带”问题

      本文链接:https://www.haomeiwen.com/subject/gapafktx.html