在一个可以通过overflow-x滚动的html cssAngular 表中,有没有一种方法可以固定最右边的列,这样当我从左向右滚动时,该列就保持在那里?我尝试了粘性属性,以及创建两个表紧挨着彼此(这并没有成功地完成任务。我在想我应该覆盖两个表在顶部彼此,但我不知道我应该如何去做这一点。
bhmjp9jg1#
position: sticky在chrome和firefox上运行良好:
position: sticky
div { width: 100%; overflow: hidden; overflow-x: scroll; } table, th, td { border: 1px solid black; background-color: white; } table { width: 1000px; } .sticky-col { width: 40px; position: sticky; right: 0; }
<div> <table> <tr><th>1</th><th>2</th><th class="sticky-col">3</th></tr> <tr><td>1,1</td><td>1,2</td><td class="sticky-col">1,3</td></tr> <tr><td>2,1</td><td>2,2</td><td class="sticky-col">2,3</td></tr> <tr><td>3,1</td><td>3,2</td><td class="sticky-col">3,3</td></tr> </table> </div>
1条答案
按热度按时间bhmjp9jg1#
position: sticky
在chrome和firefox上运行良好: