1

我在 Chrome 19 中的以下 html 代码中有问题。如果我从输入字段中复制文本“Hello”并将其粘贴到同一字段中,则文本的垂直对齐在顶部,但它应该在中间.

如果我从样式中删除 font-size 属性,效果不会出现。这是浏览器错误,还是我对样式属性做错了什么?

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <title>Title</title>
 </head>
 <body>
  <div style="width:200px;height:50px;">
   <input type="text" style="width:100%;height:100%;font-size:1.75em;" value="Hello world!"/>
  </div>
 </body>
</html>
4

1 回答 1

2

此问题绝对是浏览器错误,但仍有办法修复它。对我有用的是在输入中添加一个行高,其值等于高度的值。

我以像素而不是百分比设置我的高度,当我尝试以百分比设置它们时,它似乎不起作用。不过,Ems 做到了。使用这种策略,您的代码可能类似于:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <title>Title</title>
 </head>
 <body>
  <div style="width:200px;height:50px;">
   <input type="text" style="width:100%;height:2em;line-height:2em;font-size:1.75em;" value="Hello world!"/>
  </div>
 </body>
</html>
于 2012-06-27T19:18:16.503 回答