1、同级存在浮动,如mid的前面left浮动(mid不浮动),margin则相对于父元素,mid的margin-left不是相对于left,而是相对于con(可以想象,如果left不浮动,则mid和left不在同一行,margin的参考对象自然是父元素)。但是如果margin-left的值小于left的宽度,是不起作用的(mid的宽度等于父容器宽度减去左右margin,浏览器查看元素是起作用的,ul会掉到最下面),mid和left会紧靠在一起。

2、margin-left和margin-right相当于给元素定宽(不是显示定宽,比如如果元素内没有内容,宽度是0,当内容是连续数字或字母也起不到定宽的作用)。

3、 float会使行内元素转为行内块元素,width会起作用。

4、mid如果也加上左浮动,并且不设置宽度,margin-left和margin-right会限制mid的宽度,但是mid不会和left在同一行,尽管left右边还有足够的位子。

关于float和margin的更多相关文章

  1. global,$GLOBALS[' '] 全局, 浮动float跟margin的注意事项

    $a; global只能声明变量为全局,不能赋值,否则报错未定义:global $a; 相对于$GLOBALS['a'],写法是这样的,所有定义过的变量都存在这里: //浮动float跟margin的 ...

  2. CSS中的float和margin的混合使用

    在最近的学习中,在GitHub上找了一些布局练习,我发现了我自己对布局超级不熟悉(很难受). 在以前的学习中,感觉使用CSS就记住各个属性的功能就OK了,但是呢?真的很打脸.不说了,太伤心了,进入正题 ...

  3. position,display,float,overflow,margin,padding之间的相互影响

    1.元素分为块级元素和行内元素, 块级元素可以设置宽高,会自动换行,并且会发生相邻margin的合并问题.行内元素设置宽和高无效,以水平方向排列,(行内元素,绝对定位,浮动元素不会发生外边距合并)并且 ...

  4. 定位之float 同一父元素的float相互影响,float是margin盒子在父元素的padding盒子内

  5. margin双边距的问题

    margin:20px;height:20px;float:left margin:20px;height:20px;float:left

  6. web前端学习部落22群 明白何谓Margin Collapse

    明白何谓Margin Collapse 不同于其他很多属性,盒模型中垂直方向上的Margin会在相遇时发生崩塌,也就是说当某个元素的底部Margin与另一个元素的顶部Margin相邻时,只有二者中的较 ...

  7. 深入理解BFC和外边距合并(Margin Collapse)

    一.什么是BFC? 1.BFC的概念 BFC全称Block Formatting Context ,直译“块级格式化上下文”,也有译作“块级格式化范围”.它是 W3C CSS 2.1 规范中的一个概念 ...

  8. 图片垂直居中 和 float

    //图片垂直居中, display:table-cell; vertical-align:middle;   不能和 css (float)元素共存,可以在元素外面多加一个层 css .th-left ...

  9. [转][译]关于CSS中的float和position和z-index

    原文:http://learn.shayhowe.com/advanced-html-css/detailed-css-positioning 当构建页面排版时,有不同的方法可以使用.使用哪一种方法取 ...

随机推荐

  1. myeclipse转到函数定义的方法去

    转到函数的定义CTRl+鼠标左击 myeclipse自动补全的快捷键 alt+/

  2. VS-项目发布失败的解决方案1

    报错信息 错误 1 未能将文件 Script\easyui\themes\gray\images\Thumbs.db 复制到 obj\Release\Package\PackageTmp\Script ...

  3. 那些让IE6-8羞愧的替补型js

    1,html5shiv 这个js特别简单,可以让IE8识别一些新的标签,常用的比如 header footor section,就能使用更好的语义的标签了. 引入方式: <!--[if lt I ...

  4. HttpClient异步调用WEB服务

    using System; using System.Collections.Generic; using System.IO; using System.Linq; using System.Net ...

  5. HTTP的RST包与WinHttp延迟关闭TCP连接

    一.RST包也常见于断开TCP连接  几个月前用wireshark抓HTTP包发现有的网络通信在结束的时候没有使用四次握手,而是直接使用RST包.如: 在TCP协议中RST表示复位,用来异常的关闭连接 ...

  6. MySQL学习笔记一:常用显示命令

    1.开启和关闭MySQL服务 WIN平台:NET START MYSQL55 :NET STOP MYSQL55 Linux平台:service mysql start : service mysql ...

  7. 在ubuntu上面配置nginx实现反向代理和负载均衡

    上一篇文章(http://www.cnblogs.com/chenxizhang/p/4684260.html),我做了一个实验,就是利用Visual Studio,基于Nancy框架,开发了一个自托 ...

  8. php isset( $test ) 的神奇之处。

    很久一段时间没更新博客了,由于近段时间一直在忙 挑战杯 的项目,所以没怎样把一些总结放上来.这次,总结下 php 的一个 函数 : boolean isset($test), 返回值:boolean类 ...

  9. 初识MongoDB

    1. 初识 接触MongoDB,是由于最近在工作中用到了MongoDB做数据存储.之前也听说过这个NoSQL数据库,但是一直没有尝试去使用它做开发.这次趁着这个机会,想好好学习下这个NoSQL数据库. ...

  10. Understanding delete

    简述 我们都知道无法通过delete关键字针对变量和函数进行操作,而对于显示的对象属性声明却可以进行,这个原因需要深究到js的实现层上去,让我们跟随 Understanding delete 来探究一 ...