Bootstrap的栅格布局超级方便我们写网页。但是在不是全体配合使用的情况下,会出现横向滚动条的现象。

什么叫不是配合使用的情况呢?
>>一种情况是:你使用了row作为你的第一层父元素;而row是有样式:margin-left: -15px;margin-right:-15px。
>> 就是这两个负数和作为第一层div导致了横向滚动条的出现。
>>其实这个row这样设计是与bootrap设计的container作为row父级配合的。

所以在使用的时候:
* 尽可能不把row放在某块的最外层元素;
* 即使想,那就给个确定的宽;
* 或者加个container做其父级元素;
* 当然,直接修改row的样式也是可以的:margin-left: 0; margin-right: 0.

网页出现横向滚动条的原因可能是使用bootstrap不当引起的更多相关文章

  1. html代码能让网页的横向滚动条默认居中

    在body 中加入 onload="window.scrollTo((document.body.scrollWidth-document.body.offsetWidth)/2,0)&qu ...

  2. 逆天的IE7中,诡异的横向滚动条

    今天老邹我又要吐槽IE7了,这个奇葩浏览器总是不让省心.这回遇到的问题,灰常难发现是怎么回事,不过还是让我发现原因,哈哈,只要原因去干掉这个问题比躲避问题用别的办法绕开要爽的多啊. 首先我还是介绍下, ...

  3. DataTables固定表格宽度(设置横向滚动条)

    当表格的列比较多的时候,可能就需要固定表格的宽度了,默认的100%宽已经不适应了.默认的100%宽要实现改变窗口大小也100%的话,在table元素上添加width="100%", ...

  4. flex布局下el-table横向滚动条失效

    如下图,是一种常见的页面结构,我们可以有很多方法实现,inline-block,float,flex等等 但是,最近项目中遇到一个怪事,左边是侧边栏导航,右边是一个数据展示table,el-table ...

  5. iframe ie低版本 横向滚动条的解决办法

    吐槽下百度,在百度搜这个问题都是渣渣,谷歌直接就出来了,记录一下 设置Frame时,有一属性是scrolling="yes/no/auto",IE6的mozilla都支持,或许对a ...

  6. android 横向滚动条

    /*** * 横向滚动条,修改版,从左向右滚动,支持html代码和html里面的网络图片 */public class MarqueeView extends LinearLayout { priva ...

  7. WPF,解决Listbox,按住ListboxItem向下拖出Listbox,横向滚动条跑到最后。

    类似这种样式的控件,.,在横向滚动条隐藏的情况下有这样的问题.(横向滚动条显示的时候也会,,目前不知道怎么解决.) 因为这个控件偏移是利用ListBox的ItemsPanelTemplate模版里的S ...

  8. jquery横向滚动条

    此代码献给wendy 由于工作太忙,下次再整理成插件调用,先记录下来,欢迎同学们提意见. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Tr ...

  9. DataGrid横向滚动条无法拖动的问题

    项目中经常遇到一些问题,这些问题可能很简单,但是之前从未遇到,可能经过了一番谷歌,也可能是查阅了MSDN,或是借鉴了大牛博客,逐渐有了些眉目,为了将这些东西落地,也为了将来之不易的东西记录下来,以备今 ...

随机推荐

  1. hadoop之HDFS核心类Filesystem的使用

    1.导入jar包,要使用hadoop的HDFS就要导入hadoop-2.7.7\share\hadoop\common下的3个jar包和lib下的依赖包.hadoop-2.7.7\share\hado ...

  2. Orleans[NET Core 3.1] 学习笔记(四)( 3 )监控Orleans Silo的方式 OrleansDashboard

    简介 Orleans用起来的确很爽,更爽的是咱们有能监控它的工具. OrleansDashboard 这个工具是一个可视化的Silo监控工具,Silo和Grain的活跃状态一目了然,各个接口的响应速度 ...

  3. 关于...corresponds to your MySQL server version for the right syntax to use near '?' at line 1的解决办法

    完整报错信息: java.sql.SQLSyntaxErrorException: You have an error in your SQL syntax; check the manual tha ...

  4. 使用 setTimeout 来模拟一个 setInterval

    setTimeout 超时调用:在多少时间 在执行: setinterval 每隔多少时间 就调用 例如: setTimeout这个的值是1000,也就是说在页面刷新后,1000毫秒之后才调用这个函数 ...

  5. CentOS7.6安装MySQL8.0(图文详细篇)

    目录 一.安装前准备 二.安装MySQL 三.设置远程登录 四.安装问题解决 五.设置MySQL开机自启 一.安装前准备 1.在官网下载MySQL安装包(注意下载的安装包类型)  2.查看是否安装ma ...

  6. 00-django | 02-处理HTTP请求

    00-django | 02-处理HTTP请求 python Django Django 处理 HTTP 请求 Hello 视图函数 我们先以一个最简单的 Hello World 为例来看看 djan ...

  7. 简单配置让iterm2用得更爽

    同步自本人独立博客:https://liushiming.cn/2020/01/15/awesome-iterm2-config/ 概述 iterm2比mac原生的terminal好用很多,是mac下 ...

  8. 安装NFS到CentOS(YUM)

    运行环境 系统版本:CentOS Linux release 7.3.1611 软件版本:无 硬件要求:无 安装过程 1.配置YUM源 [root@localhost ~]# rpm -i https ...

  9. webstrom 2019 注册码(可用 2019年10月14日08:59:18)

    K6IXATEF43-eyJsaWNlbnNlSWQiOiJLNklYQVRFRjQzIiwibGljZW5zZWVOYW1lIjoi5o6I5p2D5Luj55CG5ZWGOiBodHRwOi8va ...

  10. (一)Python GUI 创建及添加部件

    1 开始创建Python GUI 实现代码: import tkinter as tk win = tk.Tk() win.title("Python GUI") win.main ...