Html Internet Explorer中的简单模态问题

SimpleModel和多个浏览器存在令人讨厌的问题。我收集了一个例子来说明这个问题。当它在Firefox或Chrome中运行时，它可以正常工作。这是一个简单的链接，点击后会弹出一个简单的对话框。如果您单击“是”按钮，将弹出一个警告，提示您这样做；如果您单击“否”，则对话框将关闭，而不执行任何操作。在Internet Explorer中运行时会出现这些问题。在版本9中，对话框出现在页面内容的下方，而在左侧，当它应该出现在页面的中间时。它还将光标更改为等待，然后挂起。在版本8中，对话框出现在同一个位置，但是按钮是可点击的，对话框可以正常工作——它只是不在正确的位置。我查看了所有的css，没有发现问题可能是什么。任何帮助都将不胜感激。以下是页面代码和css：

HTML标记

<div id='container'>
    <div id='content'>
        <div id='confirm-dialog'>
        <h1>Dialog Test</h1>
        <a href="#" class='confirm'>Click Me for Dialog</a><br />
    </div>
    <div id='confirm'>
        <div class='header'><span>Dialog Window</span></div>
        <div class='message'>
            <p>This is a dialog.</p>
            <p>There are many like it, but this one is mine.</p>
            <p>Got it?</p>
        </div>
        <div class='buttons'>
            <div class='no simplemodal-close'>No</div>
            <div class='yes'>Yes</div>
        </div>
    </div>
</div>

---

在另一个帖子中找到了答案——尽管在我发布之前进行了搜索，但在我最初的搜索中没有显示该帖子

解决方案是更改以下内容：

containerCss: {
  height: 250,
  width: 400,
  backgroundColor: '#fff',
  border: '3px solid #ccc',
},

为此：

containerCss: {
  height: 250,
  width: 400,
  backgroundColor: '#fff',
  border: '3px solid #ccc',
  position: 'absolute', top: '0px'
},

---

在另一个帖子中找到了答案——尽管在我发布之前进行了搜索，但在我最初的搜索中没有显示该帖子

解决方案是更改以下内容：

containerCss: {
  height: 250,
  width: 400,
  backgroundColor: '#fff',
  border: '3px solid #ccc',
},

为此：

containerCss: {
  height: 250,
  width: 400,
  backgroundColor: '#fff',
  border: '3px solid #ccc',
  position: 'absolute', top: '0px'
},