IE浏览器下float之间出现的小缝隙？
只有在IE下出现这种情况？
html：
<div class="report">
<form action="">
<div class="comment_frame clearfix">
<textarea type="text" class="comment_text"></textarea>
<a class="submit_report" href="#">发表</a>
</div>
</form>
<a class="biaoqing" href="#"><span class="toolbar-biaoqing"></span>添加表情</a>
</div>
css如下：
.report {
width: 576px;
padding: 10px 27px;
background-color: #e6e5e5;
}
/* line 633, ../sass/other.scss */
.show_username {
font-size: 14px;
border-bottom: 10px;
}
/* line 638, ../sass/other.scss */
.comment_text {
resize: none;
width: 504px;
height: 62px;
border: 1px solid #139667;
}
/* line 645, ../sass/other.scss */
.submit_report {
float: right;
width: 66px;
line-height: 68px;
text-align: center;
color: #fff;
background-color: #139667;
}
.clearfix {
*height: 1%;
}
/* line 4, ../sass/_once.scss */
.clearfix:after {
clear: both;
content: '.';
display: block;
height: 0;
line-height: 0;
overflow: hidden;
}
不知为什么会多出几px？
oO豆豆Oo
9 years, 7 months ago
Answers
如上所说,一起float:left就解决了,如果你想使用原有的方案,那就麻烦一点.
首先你要知道不同浏览器对元素的预设css是不一样的,margin,padding什么的都不同,首先你就要消除这些差异.
css.comment_text { resize: none; width: 504px; height: 66px; border: 1px solid #139667; display: inline-block; padding: 0; margin: 0; } .clearfix { display: inline-block; }
应该也可以解决
muriko
answered 9 years, 7 months ago
