html - 滚动表格时加载栏不会停留在表格行内

标签 html css

我的应用程序中有一个加载栏。问题是,如果我有一个滚动表,如果其中一个表行显示加载栏,而加载正在发生,如果用户向上或向下滚动表,则加载栏图像会停留在用户所在的位置正在滚动表格,所以看起来加载栏在前台,表格在后台滚动。

我只是想让加载栏在用户滚动表格时保持在其行内,如何更改 css 才能实现这一点?

以下是加载栏的 html:

<p class='imagef1_upload_process' align='center'>Loading...<br/><img src='Images/loader.gif' /><br/></p>

下面是加载栏和滚动表的css:

//loading bar

    .imagef1_upload_process{
        position:absolute;
        visibility:hidden;
        text-align:center;
        margin-bottom:0px;
        padding-bottom:0px; 
        }


//scroll table

#details{
    height:500px;
    overflow:auto;
}

最佳答案

您已将加载栏位置设置为绝对位置。要将其绝对定位在另一个容器内,包含元素也需要一个位置属性。

因此,无论包含该加载栏的内容都需要 position:relative;添加到它的CSS。应该这样做。

关于html - 滚动表格时加载栏不会停留在表格行内,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12895790/

相关文章:

html - 为什么我的 slider 在 Firefox 中显示不正确?

html - CSS Column Count 两项高于另一项

css - 如何添加行内元素以填充可用的水平空间?

css - 使用 iframe 作为 "CSS boundary"是否可以?

jQuery:仅从第二次悬停触发鼠标悬停

jquery - 根据选择显示不同的 body 背景图像

html - CSS 类定位

html - 删除 <table> 标准换行符

html - 将鼠标悬停在文本列表上时更改图像

jquery - CSS::Fixed header 没有设置 position:fixed