为什么margin:0 auto不能用于inline-block元素
前言：今天一个实习生问我，为什么他对图片使用了margin:0 auto，但图片却没有居中，我让他换成对父元素使用text-align:center即可。为什么margin:0 auto对图片不起作用，这是以前入门的时候看《css权威指南》知道的，后来一直这么用，突然有点忘记为什么了。于是又去翻了下书，这里分享下自己的理解。
块级元素的水平属性
块级元素在水平方向上有7大属性，margin-left、border-left、padding-left、width、padding-right、border-right和margin-right。
- 这7大属性的值加起来必须是元素包含块的宽度（这一点记住，一会要考
为什么margin:0 auto不能用于inline-block元素的更多相关文章
- 正确的使用margin:0 auto与body{text-align:center;}实现元素居中（转）
body{text-align:center}与margin:0 auto的异同? text-align是用于设置或对象中文本的对齐方式.一般情况下我们设置文本对齐方式的时候需要用此属性进行设置 我们 ...
- 绝对定位后，position:absolute;不能使用margin: 0 auto;实现居中；
声明: web小白的笔记,欢迎大神指点!联系QQ:1522025433. 我们都知道margin: 0 auto:可也实现块状元素的水平居中:但是对于绝对顶为的元素就会失效: 请看实例: <!d ...
- margin:0 auto 与 text-align:center
1.text-align:通过指定行框与哪个点对齐,从而设置块级元素内文本的水平对齐方式; text-align:center 设置文本或img标签等一些内联对象的居中. 2.m ...
- margin:0 auto 与 text-align:center 的区别
基本概念: 1.text-align: 属性规定元素中的文本的水平对齐方式; 该属性通过指定行框与哪个点对齐,从而设置块级元素内文本的水平对齐方式; 一般情况下设置文本对齐方式的时使用此属性.支 ...
- margin:0 auto 与 text-align:center 的区别（转载）
摘自:http://www.cnblogs.com/zhwl/p/3529473.html 基本概念: 1.text-align: 属性规定元素中的文本的水平对齐方式; 该属性通过指定行框与哪个点 ...
- 图片margin:0 auto;为何不居中
图片margin:0 auto;为何不居中 关键: img元素 display设为block 代码: <!DOCTYPE html> <html> <head> & ...
- margin:0 auto在IE中失效的解决方案
转自:http://www.cnblogs.com/hongchenok/archive/2012/11/29/2795041.html 最近在开发项目的时候,发现在火狐浏览器中设置外容器margin ...
- css中margin:0 auto没作用
很多初学制作网页的朋友,可能会遇到的一个常见问题,就是在CSS中加了margin:0 auto;却没有效果,不能居中的问题!margin:0 auto;的意思就是:上下边界为0,左右根据宽度自适应!其 ...
- CSS中margin: 0 auto；样式没有生效
问题:有两个元素: A, B.两则是嵌套关系,A是B的父节点.A和B都是块元素.当在A上设置:margin: 0 auto的时候,B并没有在页面中居中. margin: 0 auto 为什么没有生效? ...
随机推荐
- PHP7有没有你们说的那么牛逼
男人不能快,但程序一定要快.PHP7到底快不快,我们拭目以待. PHP7来一发 PHP7正式发布到现在已经一年半了,刚出道就号称比旧版本快了几倍,各种开源框架或系统运行在PHP7上速度效率提高了几倍, ...
- ActiveMQ的静态网络配置
static networkConnector是用于创建一个静态的配置对于网络中的多个Broker做集群,这种协议用于复合url,一个复合url包括多个url地址. <networkConnec ...
- NIPS 2018 | 程序翻译新突破：UC伯克利提出树到树的程序翻译神经网络
NIPS 2018 | 程序翻译新突破:UC伯克利提出树到树的程序翻译神经网络 机器之心 已认证的官方帐号 49 人赞同了该文章 选自arXiv,作者:Xinyun Chen.Chang Liu. ...
- java中针对 try和finally一些总结
结论 1.不管有没有异常,finally中的代码都会执行 2.当try.catch中有return时,finally中的代码依然会继续执行 3.finally是在return后面的表达式运算之后执行的 ...
- 【转】[STL]vector和deque的内存释放(clear)
vector的clear成员函数可以清除vector中的元素,使其大小减至0.但它却不能减小vector占用的内存. [cpp] view plain copy int main() { vector ...
- ubuntu16下 Oracle安装完毕，测试是否安装成功的步骤
1.查看oracle的环境变量,在终端输入命令 echo $ORACLE_BASE echo $ORACLE_HOME echo $PATH 看输出是不是安装时设置的路径 2.开启监听器 lsnrct ...
- JS基础 sessionStorage
html5中的Web Storage包括了两种存储方式:sessionStorage和localStorage. sessionStorage用于本地存储一个会话(session)中的数据,这些数据只 ...
- 建表时表空间的一些参数pctfree initrans maxtrans storage的含义
转自:https://a475334705.iteye.com/blog/2291441 create table X_SMALL_AREA ( idx_id NUMBER ...
- Array + two points leetcode.18 - 4Sum
题面 Given an array nums of n integers and an integer target, are there elements a, b, c, and d in num ...
- X宝个人支付到账
扫码登录,能看懂的我就不多说了,封了我多少篇文章了!!!!X宝个人到账通知.
- 正确的使用margin:0 auto与body{text-align:center;}实现元素居中（转）