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. Redis 图形化监控方案 RedisLive 介绍

    作为一款开源的 Redis 图形化监控工具,RedisLive 提供对 Redis 实例的内存使用情况,接收的客户端命令,接收的请求数量以及键进行监控.RedisLive 的工作原理基于 Redis ...

  2. angular 使用概术

    框架技术细节说明 must 该文档详细说明了基于Angular的机制及关键技术. 目录: - 路由机制 - 通过路由来切分页面模块 - Lazyload机制 - 指令 - 程序bootstrap - ...

  3. TensorFlow[1]:概念和简例

    简介 TensorFlow是一个实现机器学习算法的接口,也是执行机器学习算法的框架.使用数据流式图规划计算流程,可以将计算映射到不同的硬件和操作系统平台. 主要概念 TensorFlow的计算可以表示 ...

  4. 1455:An Easy Problem

    传送门:http://noi.openjudge.cn/ch0406/1455/ /-24作业 //#include "stdafx.h" #include<bits/std ...

  5. Java提高十七:TreeSet 深入分析

    前一篇我们分析了TreeMap,接下来我们分析TreeSet,比较有意思的地方是,似乎有Map和Set的地方,Set几乎都成了Map的一个马甲.此话怎讲呢?在前面一篇讨论HashMap和HashSet ...

  6. 快速排序Golang版本

    Created by jinhan on --. Tip: http://blog.csdn.net/zhengqijun_/article/details/53038831 See: https:/ ...

  7. 单节点下使用docker部署consul

    部署consul 目前Consul使用的版本是: v1.0.1 本教程适用于刚刚开始学习consul并简单使用consul的同学,可以在短时间内了解conusl,配合官方文档https://www.c ...

  8. 边框(Border) 和 轮廓(Outline) 属性

    border 复合属性.设置对象边框的特性. 标签定义及使用说明 如果上述值缺少一个没有关系,例如border:#FF0000;是允许的. 默认值: not specified 继承: no Java ...

  9. 《Flask Web开发——基于Python的Web应用开发实践》一字一句上机实践(上)

    目录 前言 第1章 安装 第2章 程序的基本结构 第3章 模板 第4章 Web表单 第5章 数据库 第6章 电子邮件 第7章 大型程序的结构   前言 学习Python也有一个半月时间了,学到现在感觉 ...

  10. codeforces 895A Pizza Separation 枚举

    codeforces 895A Pizza Separation 题目大意: 分成两大部分,使得这两部分的差值最小(注意是圆形,首尾相连) 思路: 分割出来的部分是连续的,开二倍枚举. 注意不要看成0 ...