问题:有两个元素: 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. python groupby的小技巧

    df.groupby('col',as_index=False),agg(ufunk)#as_index=False,可以消除层次索引 更多grouby的用法 http://blog.csdn.net ...

  2. Android Studio中导入v4,v7和recyclerview-v7包的方法

    概述 Android Studio中新建工程中会默认导入v7的包,即在gradle中默认配置了com.android.support:appcompat-v7:x.x.x的依赖.但是不会默认为我们配置 ...

  3. mac os安装macvim

    1 brew install macvim 安装 macvim 2 alias vim='/usr/local/Cellar/macvim/7.4-73_1/MacVim.app/Contents/M ...

  4. php和c++socket通讯(基于字节流,二进制)

    研究了一下PHP和C++socket通讯,用C++作为服务器端,php作为客户端进行. socket通讯是基于协议的,因此,只要双方协议一致就行. 关于协议的选择:我看过网上大部分协议都是在应用层的协 ...

  5. php spl数据结构

    1.双链表SplDoublyLinkedList 结构如图: 类定义: SplDoublyLinkedList implements Iterator , ArrayAccess , Countabl ...

  6. .net程序集标示与绑定上下文

    之前在实现Autofac扫描自加载程序集实现IOC时候遇到程序集依赖的问题,在网上搜了一下,没有发现中文世界的相关描述.随取google拿了几篇文章,翻译&自己的理解,之后会写一些小demo, ...

  7. Spring Boot + Redis 实现Shiro集群

    为实现Web应用的分布式集群部署,要解决登录session的统一.本文利用shiro做权限控制,redis做session存储,结合spring boot快速配置实现session共享. 1.引入相关 ...

  8. 从零开始的全栈工程师——js篇2.18(js的运动)

    一.元素的 client offset scroll 三个系列 clientWidth / clientHeight / clientTop / clientLeftoffsetWidth / off ...

  9. Jquery插件之ajaxForm简介

    我们平常在使用jQuery异步提交表单的时候,一般都是加载在submit事件中,如下所示: $(document).ready(function(){ $('#myForm').submit(func ...

  10. The fool doth think he is wise, but the wise man knows himself to be a fool.

    The fool doth think he is wise, but the wise man knows himself to be a fool.愚者总自以为聪明,智者则有自知之明.