问题:有两个元素: 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. Linux下Tomcat启动关闭命令

    1.首先,进入Tomcat下的bin目录 cd /usr/local/tomcat/bin 2.查看Tomcat是否以关闭 ps -ef|grep tomcat 如果显示以下信息,说明Tomcat还没 ...

  2. java编程--03介绍关于日期常用的计算

    /** * 获取2个日期之间的天数差 * d2-d1 * @return * @throws Exception * @Description: */ public static int getDif ...

  3. jemeter接口测试基础

    前言: 本文主要针对http接口进行测试,使用Jmeter工具实现. Jmter工具设计之初是用于做性能测试的,它在实现对各种接口的调用方面已经做的比较成熟,因此,本次直接使用Jmeter工具来完成对 ...

  4. ThreadFactory

    在Java中有两类线程:User Thread(用户线程).Daemon Thread(守护线程) 比如,任何一个守护线程都是整个JVM中所有非守护线程的保姆:只要当前JVM实例中尚存在任何一个非守护 ...

  5. Spring boot-(2) Spring Boot使用

    1. 构建系统 (1) 使用maven构建 1) 从Starter Parent继承 在项目中配置继承spring-boot-starter-parent,可以进行如下设置: <!-- Inhe ...

  6. 文件夹选择之FolderBrowserDialog控件

    应用程序可能只允许用户选择文佳夹而非文件,例如在播放MP3时,用户可能把所有的MP3放在一个文佳夹内,在添加时,只要选择添加这个文佳夹,将会把在这个文件内的所有MP3添加的播放器里.在这里对播放器来说 ...

  7. 使用ajax获取用户所在地的天气

    1.要获取用户归属地的天气,首先得获取用户所在的市区, 这里先获取用户的IP,通过IP获取IP的归属地,从而得到用户 地址. 获取客户端ip: js: <scripttype="tex ...

  8. Oracle 求昨天 上个月 去年 日期

    到公司发现有一个报表没有收到,查看后发现原来是Oracle数据源异常. ' day, 'yyyyMMdd') AS enddata FROM DUAL; 上面这个sql求上个月今天和昨天.一般情况下不 ...

  9. 修复kindEditor点击加粗, 内容焦点跳动的问题

    大概1560~1569行 pos : function() { var self = this, node = self[0], x = 0, y = 0; if (node) { if (node. ...

  10. 从今天开始学习Swift -- Swift 初见 (转)

    原文地址:http://www.cocoachina.com/newbie/basic/2014/0604/8675.html   Swift系列文章由CocoaChina翻译小组翻译自苹果的官方文档 ...