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

chrome下float元素下input选中内容bug

时间:2015-02-13 18:26:20      阅读:196      评论:0      收藏:0      [点我收藏+]

标签:

今天在写一个小demo的时候,发现chrome下一个很奇怪的bug。

我的代码如下:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>chrome下float bug</title>
  <style>
.clearfix{*zoom:1;}
.clearfix:after{content:"";display:block;font:0/0 a;height:0;overflow:hidden;clear:both;}
.fl{float:left;padding:10px;}
.fl{}
  </style>
</head>
<body>
  <div class="clearfix">
    <div class="fl"><input type="text" value="123456778889123456778889123456778889"></div>
  </div>
</body>
</html>

我点击输入框下面的某个地方,发现input里面的内容会被选中,效果如下:DEMO

技术分享

 

这个bug很奇怪,解决办法有两个:

1、把外层div的float去掉。

2、把.clearfix 里面的display:block;改成table。

chrome下float元素下input选中内容bug

标签:

原文地址:http://www.cnblogs.com/ayseeing/p/4290663.html

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