IE位置:相对显示就像位置:静态

时间:2010-08-20 11:14:21

标签: css internet-explorer static positioning relative

我有以下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文件中都没有被称为静态的位置,我想知道是否有人之前遇到过这个问题,如果有的话,我怎么解决它。

-Matt

:更新:。

只是对此的更新,我发现问题是JQuery将定位直接注入主div的'style'部分:

start: function(event, ui)
{
  --->  $(diary_event).attr('style','position: relative'); <----
    diary_event = $(this);
    diary_event_parent = $(this).parent();
}

然而,如果我删除它,它会破坏在除IE之外的所有其他浏览器中准确地重新拖动已删除元素的能力,

换句话说,我已找到问题所在的位置,但不知道如何解决问题&gt; _&lt; -Matt

1 个答案:

答案 0 :(得分:2)

这是因为ie6&amp; 7中存在错误。你只需添加位置:相对于“body”元素(而不是你的“body”占位符)。 http://friendlybit.com/css/ie6-resize-bug/

希望它有所帮助!