我有以下 HTML(摘自较大的代码库)
<div class="diary-event ui-corner-all" title="[title]">
<span id="delete"></span>
<div class="diary-event-title ui-corner-all">[title]</div>
<div class="diary-event-body ui-corner-all">
<p class="hyphenate">[body]</p>
</div>
</div>
(其中[title]和[body]是动态生成的字符串)
其样式如下:
.ui-corner-all
{
-moz-border-radius:4px 4px 4px 4px;
}
.diary-event
{
display:block;
height:100%;
position:relative !important;
vertical-align:top;
width:100%;
word-wrap:break-word;
}
table *
{
margin:0;
padding:0;
}
#diary-grid
{
border-collapse:collapse;
}
body
{
font-family:Arial;
}
现在,在 Firefox、Chrome 和大多数其他浏览器中,此 div 的相对定位意味着它会与页面的其余部分一起滚动,没有问题,但由于某些原因,在 IE 6 和 7 中,它的行为就好像定位是静态的(IE 8 工作正常)。
CSS 文件的/any/中没有任何位置被称为静态,我想知道是否有人以前遇到过这个问题,如果是的话,我该如何解决它。
我发现问题在于 jQuery 将定位直接注入(inject)到主 div 的“style”部分:
start: function(event, ui)
{
$(diary_event).attr('style','position: relative'); // <----
diary_event = $(this);
diary_event_parent = $(this).parent();
}
但是,如果我删除它,它将破坏在除 IE 之外的所有其他浏览器中准确地重新拖动放置的元素的能力。
换句话说,我找到了问题所在,但没有找到解决办法>_<
最佳答案
这是因为 ie6&7 中的一个错误。您只需添加position:relative于“body”元素(而不是“body”占位符)。 http://friendlybit.com/css/ie6-resize-bug/
希望对你有帮助!
关于css - 位置 : relative displaying as if position: static,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3530323/