码迷,mamicode.com
首页 > 其他好文 > 详细

兼容性—IE6下文字溢出

时间:2017-05-14 18:51:31      阅读:95      评论:0      收藏:0      [点我收藏+]

标签:back   pre   浮动   显示   产生   logs   分享   元素   image   

两个浮动元素之间用内联元素或者注释并且和父级宽度不超过3px,IE6下出产生文字溢出bug,具体代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
        .wrap{
            width: 400px;
        }
        .left{
            float: left;
            
        }
        .right{
            float: right;
            width: 400px;
        }
    </style>
</head>
<body>
    <div class="wrap">
        <div class="left"></div>
        <span></span>
        <div class="right">&darr;这是多出了的一头猪</div>
    </div>
</body>
</html>

显示效果:

技术分享

解决方案:

1、两个浮动元素之间避免出现内联元素或者注释

2、与父级宽度相差3px以上

.right{
            float: right;
            width: 397px;
}

 

兼容性—IE6下文字溢出

标签:back   pre   浮动   显示   产生   logs   分享   元素   image   

原文地址:http://www.cnblogs.com/halai/p/6853196.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!