问题:有两个元素: A, B。两则是嵌套关系,A是B的父节点。A和B都是块元素。当在A上设置:margin: 0 auto的时候,B并没有在页面中居中。

margin: 0 auto 为什么没有生效?

解决:margin:0 auto;生效,需要一定的前提条件。

1 两者是块元素,即 display: block;

2 父元素需要有宽度,即 width: x px;

3 在有前两者的前提下,设置 margin: 0 auto;即可实现居中。

小结:问题出现的原因是,没有给A元素设置宽度。给A元素加上宽度后,B元素就可以居中了。

CSS中margin: 0 auto;样式没有生效的更多相关文章

  1. css中margin:0 auto没作用

    很多初学制作网页的朋友,可能会遇到的一个常见问题,就是在CSS中加了margin:0 auto;却没有效果,不能居中的问题!margin:0 auto;的意思就是:上下边界为0,左右根据宽度自适应!其 ...

  2. CSS中margin:auto什么意思?margin:auto属性的用法详解

    我们都知道使用margin:auto可以让元素水平居中的.但你有没有想过使用margin:auto可以让元素水平居中的原因,要回答这个问题,我们首先需要看一下margin:auto的工作原理.auto ...

  3. 网页CSS中*{margin:0; padding:0;}有什么用

    * 这东西叫“通配符”用来匹配页面上所有元素.*{margin:0; padding:0;} 像 2L 所说,body ,ul, li ,p,h1~h6,dd,dt 等……都有默认的margin 或p ...

  4. CSS样式margin:0 auto不居中

    <style type="text/css">html,body{height:100%;width:960px;}.container{background-colo ...

  5. CSS中设置margin:0 auto; 水平居中无效的原因分析

    很多初学制作网页的朋友,可能会遇到的一个常见问题,就是在CSS中加了margin:0 auto;却没有效果,不能居中的问题,margin:0 auto;的意思就是:上下边界为0,左右根据宽度自适应,其 ...

  6. css中元素的auto属性值是什么意思,比如margin:0 auto表示什么?

    auto 你可以理解为一种 自动/自适应 的概念 比如 现在项目需要一个宽度为960px的整体布局居中 根据用户浏览器大小不同你将需要使用margin:0 auto;来实现. 无论用户浏览器宽度为多少 ...

  7. css中两种居中方式text-align:center和margin:0 auto 的使用场景

    关于使用text-align:center和margin:0 auto 两种居中方式的比较 前言:最近由于要学习后端,需要提前学习一部分前端知识,补了补css知识,发现狂神在讲这一部分讲的不是特别清楚 ...

  8. margin:0 auto在IE中失效的解决方案

    转自:http://www.cnblogs.com/hongchenok/archive/2012/11/29/2795041.html 最近在开发项目的时候,发现在火狐浏览器中设置外容器margin ...

  9. margin:0 auto;生效条件

    1.position:absolute下不生效 原因:position:absolute只能相对于父元素进行定位top.left定位,相当于浮在父元素上面,所以margin:0 auto;就没有了参考 ...

随机推荐

  1. 正则表达式获取多个img src的值

    /** * 得到网页中图片的地址 */public static Set<String> getImgStr(String htmlStr) { Set<String> pic ...

  2. Unity 物体旋转会发生变形

    当游戏对象的 "父物体们" 有一个是缩放的,也就是Scale不是(1,1,1)的时候,旋转这个游戏对象它就会出现变形的现象.

  3. Murano Weekly Meeting 2016.07.26

    Meeting time: 2016.July.26 1:00~2:00 Chairperson:  Nikolay_St, from Mirantis Meeting summary: 1.Masc ...

  4. (转)Nmap命令的29个实用范例

    Nmap命令的29个实用范例 原文:http://os.51cto.com/art/201401/428152.htm Nmap即网络映射器对Linux系统/网络管理员来说是一个开源且非常通用的工具. ...

  5. 阿里云主机windows系统Apache启用浏览器缓存的方法

    一群友使用卡卡网的网站速度诊断工具诊断网站速度时,发现有几个需要优化的地方,其中较为重要的是“启用浏览器缓存”.诊断结果显示,网站尚未启用浏览器缓存. 图一:浏览器缓存未启用 群友找我帮忙设置一下,据 ...

  6. 位于XDB的服务器localhost要求用户名和密码,端口占用

    问题现象: 从MyEclipse启动部署在tomcat上的web程序后,出现如下问题: 然后访问tomcat主页(http://localhost:8080/),弹出如下对话框: 问题原因: 机器上安 ...

  7. MySQL锁行锁表

    select..for update; 给数据库表手动上锁 --锁行Begin; for update; --给 id=1 的行加上排它锁且 id 有索引 ; Commit; -- 锁表 BEGIN; ...

  8. cube.js 开源模块化分析框架

    cube.js 是一款很不错的模块化web 应用分析框架.cube.js 的设计主要是面向serverless 服务, 但是同时也支持所有rdbms, cube.js不是一个单体应用,包含了以下部分: ...

  9. select标签使用 三目运算符

    <td> <select id="roleName" name="roleName" class="input" styl ...

  10. base标签

    我们扒取到网站源码很多时候发现路径是采用相对路径,这时候我们就需要采用base标签了,用法非常简单, <base href="我们扒取网站的域名"/> 这时相对路径就相 ...