2

我想在输入右侧放置一个图标,使其像组合。我必须使用相对位置,因为它必须是完整的代码。我将编写一个 jQuery 插件并在任何地方使用它。

这是我的代码。Firefox 和 Chrome 可以正常显示,但 IE-9 有问题。如果我做图标margin-top -15px,它会有点底部,如果我做 -16px,它会进入输入的顶部。

我怎么解决这个问题?

<!DOCTYPE HTL>
<html>

<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8">
  <meta name="robots" content="noindex, nofollow">
  <meta name="googlebot" content="noindex">
  <meta http-equiv="cache-control" content="no-cache">
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
</head>

<body>
  <div style="width:50%; position:relative; top:0; left:0; height:0; background-color:#ccc;">
    <input class="rounded" type="text" style="width:100%;">
    <img src="https://placehold.it/77" style="position:relative; z-index:2; float:right; margin-top:-16px; padding-right:5px;" />
  </div>
</body>

</html>

4

1 回答 1

2

你为什么不使用top:-value; 我认为它对你有用

如果你只想margin-top使用这个 ie9

margin-top/*\**/:-16px\9; 和你给的其他浏览器。

也许它会帮助你。

于 2012-04-24T11:44:25.910 回答