1、图片与文字对齐问题

如果图片和文字差不多大时,使用兼容性强的margin负值方法。

方法:img{margin:0 3px -3px 0;}

2、div嵌套后margin出现失效(转移)问题

原因:盒子没有获得haslayout造成margin-top无效

方法:(1)父层div设置:{overflow:hidden;}

   (2)父层div设置:{padding-top:1px;}

   (3)父元素生成BFC;

      (4)当前元素margin-top外边距转化为padding-top;

3、IE双边距问题

产生条件:block元素+浮动+margin

方法:使用display:inline;

原因:inline元素或inline-block不存在双边距问题

margin相关的更多相关文章

  1. 盒子模型之margin相关技巧!

    废话不多说,直接进入主题,margin相关技巧. 1.设置元素水平居中:margin:x auto; 2.margin负值让元素位移及边框合并. 外边距合并 指当两个垂直外边距相遇时,它们将形成一个外 ...

  2. css margin相关问题及应用

    一.margin常见问题 1.IE6下双边距问题 margin双布局可以说是IE6下经典的bug之一.产生的条件是:block元素+浮动+margin. 2.maring重叠的问题 css2.0规范对 ...

  3. margin 相关 bug 系列

    原文地址:margin系列之bug巡演 by @doyoe IE6浮动双倍margin bug 这当是IE6最为经典的bug之一. 触发方式 元素被设置浮动 元素在与浮动一致的方向上设置margin值 ...

  4. margin相关属性值

    1.图片与文字对齐问题 图片与文字默认是居底对齐.一般img标签打头的小图标与文字对齐的话,通过 img{margin:0 3px -3px 0;} 这个的东西,能实现效果和兼容性俱佳的对齐效果: d ...

  5. html-盒子模型及pading和margin相关

    margin: <!DOCTYPE html> <html lang="en"> <head> <meta charset="U ...

  6. margin相关基本知识

    什么是 margin ? CSS 边距属性定义元素周围的空间.通过使用单独的属性,可以对上.右.下.左的外边距进行设置.也可以使用简写的外边距属性同时改变所有的外边距.——W3School 边界,元素 ...

  7. css margin的相关属性,问题及应用

    by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=48 引言:margin ...

  8. 绝对定位下margin的作用

    以前一直对绝对定位下的margin作用很模糊,今天细看一下 不使用top,left,margin等 <!DOCTYPE html> <html lang="en" ...

  9. 浅谈块元素绝对定位的margin属性

    对于div的绝对定位一直以为margin属性是无效的,只是通过top,left,bottom,right定位,然而今天的却发现不是这样的,于是对其做了些实验: 使用的HTML原始测试文件: <! ...

随机推荐

  1. WPF中DataGrid垂直滚动条滚动后导致每行CheckBox选择错乱

    问题: WPF的DataGrid中出现选取或者多选以及单选的时候,出现滚动条的时候,如果发生了滚动,默认情况下就会出现已经选择的CheckBox错乱.这样的原因何在? 解决方案: 经过查阅资料,了解到 ...

  2. http2.4简单配置

    前言: 上一篇博文说到了http的发展以及http完整请求响应的工作流程. 一.开篇: 从最简单的静态服务器开始. 之前说过,http是应用层协议,必定会在用户空间体现出具体的应用程序.常见的http ...

  3. mysql实现高可用架构之MHA

    一.简介 MHA(Master HA)是一款开源的 MySQL 的高可用程序,它为 MySQL 主从复制架构提供了 automating master failover 功能.MHA 在监控到 mas ...

  4. .net 系列:事件和委托

    在.net 的世界里,离不开委托和事件,其实理解透了后很简单,总结了一下分为5步:   1)定义委托   public delegate void RevicedEventHandler(object ...

  5. JS弹窗带遮蔽的功能

    很不错的JS原生自定义弹窗,很实用! function myAlert(str,click,useCancel){ var overflow=""; var $hidder=nul ...

  6. Java数据结构和算法(六)——前缀、中缀、后缀表达式

    前面我们介绍了三种数据结构,第一种数组主要用作数据存储,但是后面的两种栈和队列我们说主要作为程序功能实现的辅助工具,其中在介绍栈时我们知道栈可以用来做单词逆序,匹配关键字符等等,那它还有别的什么功能吗 ...

  7. 导入Excel 文件(图片和文字)NPOI+BootStrap fileinput 插件 的结合使用

    1.页面代码: <!DOCTYPE html><html><head> <meta name="viewport" content=&qu ...

  8. POJ1273 网络流-->最大流-->模板级别-->最大流常用算法总结

    一般预流推进算法: 算法思想: 对容量网络G 的一个预流f,如果存在活跃顶点,则说明该预流不是可行流. 预流推进算法就是要选择活跃顶点,并通过它把一定的流量推进到它的邻接顶点,尽可能将正的赢余减少为0 ...

  9. PHP面向对象-----魔术方法

    PHP面向对象-----魔术方法 __get($name)--触发时机:当调用一个不访问的成员属性的时候,会自动触发,可以利用这个方法来完成对不可调用的属性进行调用,但是不能设置值 ___set($n ...

  10. Python冒号的解释

    1. "没什么首次没有为第二个,跳了三个".它得到的切片序列的每一个第三个项目. 扩展片是你想要的.新在Python 2.3 2. Python的序列切片地址可以写成[开始:结束: ...