IE10字体大小降低了1px。如何修复？
IE10字体大小降低了1px。如何修复？
提问于 2014-01-19 22:51:43
因为它只有1px，所以我不知道是按钮旁边的文本框还是按钮本身。所以我打算用一个测量工具截取一个截图来观察它。从那时起，我打算查看firefox调试器和ie调试器，看看1px有什么问题。
然而，我希望有人能知道是什么导致了这种情况。
这是ie (28px)中的违规元素
这是它在FF、Chrome等中正确显示的位置( 27像素)
http://www.arcmarks.com
下面是该按钮的CSS：
#ue_but_new{
position: absolute;
padding: 8px 6px 7px 6px;
text-decoration: none;
cursor: pointer;
}
p.small_white{
font-size: 10px;
color: #ffffff;
}
.blue_but{
color: #ffffff;
border: 1px solid #057ed0;
background: -moz-linear-gradient(top, #31baed, #019ad2);
}回答 3
Stack Overflow用户
发布于 2014-01-19 23:26:59
如果将元素大小作为文本大小的基础，那么在不同的浏览器、不同的系统、不同的设置等之间，元素的大小总是不同的。
在元素上设置特定的行高，而不是从文本高度填充：
#ue_but_new{
position: absolute;
line-height: 25px;
padding: 0 6px;
text-decoration: none;
cursor: pointer;
}Stack Overflow用户
发布于 2014-01-19 23:23:42
您可以尝试在输入和按钮包装上应用边框，然后设置overflow:hidden。这样，即使它偏离了一个像素，它也是不可见的。
在HTML中：
<div>
<input type="" />
<button></button>
</div>在CSS中(大致)：
div {
border:1px solid #ccc;
border-radius:3px;
background:#fff;
overflow:hidden;
}
input {
border:0;
background:transparent;
}
button {
background:blue;
}
div, input, button { height:22px; }Stack Overflow用户
发布于 2014-01-19 23:26:43
与使用padding-bottom和padding-top相比，更喜欢将line-height属性设置为使单行文本垂直居中。
在您的示例中，font-size: 10px + padding-top: 8px + padding-bottom: 7px = line-height: 25px。
#ue_but_new {
position: absolute;
padding: 0 6px;
line-height: 25px;
text-decoration: none;
cursor: pointer;
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/21218255
复制相关文章
相似问题
腾讯云开发者
