IE7及以下多个行内元素时浮动元素折行不环绕

来源:互联网 发布:idea新建普通java项目 编辑:程序博客网 时间:2024/06/06 03:49

问题

<div class="part">    <span>万达....</span>    <a class="more" href="#"></a></div>

大多数浏览器下
这里写图片描述

IE6/7下
这里写图片描述


原因

在IE6/7中无法产生环绕效果,可能的原因有

  1. 同一个父容器内有多个行内元素;
  2. 某些为非浮动元素,某些为浮动元素(可以是左浮动或右浮动);
  3. 浮动的子元素不都是位于非浮动的子元素之前。

解决办法

  1. 更改dom结构,浮动元素放到非浮动前 或者 避免多个行内元素
  2. 采用absolute定位
  3. IE6/7下hack : *margin-top: 14px;
0 0