问题：有两个元素: 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. Android官方架构组件介绍之LifeCycle(一)

    Android官方架构组件介绍之LifeCycle 下面是官方提供的Android App开发的架构图: 从上图可以看到一些关键字:ViewModel,LiveData,Room等.其实看了上面视频的 ...

  2. Android Studio CMake 生成多个so

    生成多个so案例 这里stringFromJNI和stringFromJNI11分别是调用one-lib和two-lib两个so package com.test.ndkmoreso; import ...

  3. Searching the Web论文阅读

    Searching the Web   (Arvind Arasu etc.) 1. 概述 2000年,23%网页每天更新,.com域内网页40%每天更新.网页生存半衰期是10天.描述方法可用Pois ...

  4. RTT设备与驱动之硬件定时器

    硬件定时器可以对外部时钟进行计数,利用内部时钟进行定时. 函数 描述 rt_device_t rt_device_find(const char* name); 查找定时器设备 rt_err_t rt ...

  5. CentOS7/Ubuntu Linux java jdk 环境变量配置

    [root@localhost sony]# tar -zxvf jdk-8u121-linux-x64.tar.gz [root@localhost sony]# .0_121 /usr/local ...

  6. jQuery源代码学习笔记_01

    如何获取jQuery源代码 1.可以从GitHub上下载到没有合并和压缩的源代码 2.如果要查看兼容IE6-8的版本,请选择1.x-master分支 3.可以使用git clone也可以使用downl ...

  7. return break continue区别

    return:1.跳出整个方法体 2.返回值 function(a){return a=2}; break:跳出当前循环, continue:跳出当前判断继续执行

  8. java实现新旧版本号比较

    项目中需要使用比较现在线上版本和新版本,然后新版本执行新方法,方法如下: /** * * @方法名称:comparaVersion * @内容摘要: <版本比较> * @param old ...

  9. java解析json串常识

    注意:JSONObject 和JSONArray的使用区别 报错:A JSONObject text must begin with '{' at character 1 of 分析:  JSONOb ...

  10. 排序 & 常用算法

    一.快速排序QuickSort 快速排序和归并排序都使用分治法来设计算法,区别在于归并排序把数组分为两个基本等长的子数组,分别排好序之后还要进行归并(Merge)操作,而快速排序拆分子数组的时候显得更 ...