首先上问题:此问题为bootstrap的 container样式导致,该样式默认左右内边距15px为了栅栏效果而设计,具体看源码css样式,如下图,右侧黄色边框边距和30px,实为两个div左浮动,将边距挤到右侧;

解决它很简单:只需复写 container样式 padding-left:0px 和padding-right:0px; 然后在该容器子元素 row复写样式 .row{margin:0};即可,如果row有子元素列,col-*-* {padding:0}即可,修改后,结果图:

还有种方案:定义面板样式,可以完美避开这个问题,例如:<div class="panel panel-default"></div>

解决Bootstrap container样式左右内边距15px,导致屏幕不美观的更多相关文章

  1. css内边距与外边距的区别

    你真的了解margin吗?你知道margin有什么特性吗?你知道什么是垂直外边距合并?margin在块元素.内联元素中的区别?什么时候该用 padding而不是margin?你知道负margin吗?你 ...

  2. (转)css内边距与外边距的区别,精辟啊

    css内边距与外边距的区别 (2012-05-02 13:54:54) 转载▼ 标签: 杂谈 分类: css 本文也是网上看了后收藏的,忘了原地址(以后收藏文章得注意) 你真的了解margin吗?你知 ...

  3. CSS权威指南 - 内边距 边框 和 外边距

    九十年代的完全用表格布局,简单的段落边框都需要用表格.CSS让布局更方便. 基本元素框 basic element boxes 如同第七章基本视觉格式化那一章讲到,每个文档元素会生成一个元素框,这个框 ...

  4. CSS框模型(框模型概述、内边距、边框、外边距、外边距合并)

    CSS 框模型概述 CSS 框模型 (Box Model) 规定了元素框处理元素内容.内边距.边框 和 外边距 的方式. 元素框的最内部分是实际的内容,直接包围内容的是内边距.内边距呈现了元素的背景. ...

  5. [04-05]box框模型(Box Model)定义了元素框处理元素内容、内边距、边框和外边距的方式

    实际占有的宽 = width + 2padding(内边距) + 2border(边框) + 2margin(外边距) 实际占有的高 = height + 2padding + 2border + 2 ...

  6. css内边距 边框

    /*1 元素的各边都有 10 像素的内边距 四个值上.右.下.左 两个上下,左右 三个值:上,左右,下*/ /*p {padding: 10%;}*/ h1 { padding-top: 10px; ...

  7. ie6、7下button添加背景和边框,内边距会出现1px的边框

    ie6.7下button添加背景和边框,内边距会出现1px的空白边框 解决办法:在input外面加上一个标签,把背景和边框都写在标签的样式上面,input的 background和border都non ...

  8. CSS 框模型——规定了元素框处理元素内容、内边距、边框和外边距的方式

    转自:http://www.w3school.com.cn/css/css_boxmodel.asp 要知道在父元素:float, rel, abs位置情况下,box模型的变换情况,请见:http:/ ...

  9. CSS.03 -- 浏览器行高、字体;盒子模型--边框、内边距、外边距

    如果此时你也在自学中,请使用 FireWorks CS6 进行切图测距等,百度一下吧~ Fireworks的基本使用 新建文件   ctrl+n 打开文件  ctrl+o 调出和隐藏标尺 ctrl+r ...

随机推荐

  1. Ubuntu-Server18.04开启无线网卡并配置静态ip

    手里有一个笔记本快10年了,还是奔腾处理器,最近把它做成了Ubuntu-Server的系统,花了点时间折腾无线网卡,稍微记录一下,希望看见的人能少踩点坑. 1. 制作U盘启动工具,从Ubuntu官网下 ...

  2. 如何知道一个路由器的 BSSID ?

    使用 Mac 连接上这个路由器,然后使用 option 按 wifi 按钮,可以在详情页里找到. 有些路由中继的设置需要使用 BSSID ,比如 pandorabox openwrt

  3. AGC011-C Squared Graph

    题意 给定一个\(n\)个点\(m\)条边的图,构建一个\(n^2\)个点的图,新图的每个点都可以看成一个二元组,新图上的点\((a,b)和(a′,b′)\)之间有边,当且仅当原图中\((a,a′), ...

  4. C语言再学习part2-重新认识C语言词汇

    迷阳迷阳,无伤吾行.无行郗曲,无伤吾足.—庄子 C语言词汇: 标识符 在程序中的变量名.函数名.标号等等成为标识符.其中标识符相在C中只能是字母A~Z,a~z,数字0~9,下划线(_)组成的字符串,并 ...

  5. [CF1311A] Add Odd or Subtract Even

    Solution a<b, delta=odd, ans=1 a<b, delta=even, ans=2 a=b ans=0 a>b, delta=odd, ans=2 a> ...

  6. 剑指offer-面试题39-数组中出现次数超过一半的数字-抵消法

    /* 题目: 数组中有一个数字出现的次数超过数组长度的一半,请找出这个数字. 例如输入一个长度为9的数组{1,2,3,2,2,2,5,4,2}.由于数字2在数组中出现了5次,超过数组长度的一半,因此输 ...

  7. LeetCode 144. 二叉树的前序遍历 (非递归)

    题目链接:https://leetcode-cn.com/problems/binary-tree-preorder-traversal/ 给定一个二叉树,返回它的 前序 遍历. /** * Defi ...

  8. BundlePhobia

    1.BundlePhobia用于分析npm package的依赖.bundle后的大小.下载速度预估等等,帮助你在引用一个package之前了解引入该package的代价. 2.也可以将项目的pack ...

  9. javaweb 公文流转系统制作

    该系统主要的要求就是实现公文的流转审核,用户有多重类型,在不同用户登录的时候要进入不同的页面,并能执行他们的权限. 用户分四种,普通部门(可以草拟公文并提交),办公室(接受普通部门的公文并编辑,最后提 ...

  10. 关于xshell和文件传输相关

    Xshell连接linux系统 下载Xshell后启动软件 不能连接,没有弹出输入账户和密码时在linux中执行 然后再次执行Xshell 连接成功 文件传输 点击Xshell的文件传输 会引导你去安 ...