Почему позиция: Sticky не работает для панели, а работает для заголовка и рядов? ⇐ Javascript

[Anonymous]

Я пытаюсь добавить эффект тени, используя :: после липкого элемента внутри гибкого контейнера, но он не работает, как ожидалось. Вместо этого он переопределяет основную таблицу. < /P>
Когда я использую положение: относительно; и позиция: абсолютная;, тень появляется, но только после прокрутки горизонтально. Мне нужно, чтобы это вести себя как липкие элементы в моем заголовке и рядах моего стола, которые остаются видимыми при прокрутке. Как я могу добиться того же липкого тени для панели? < /P>

Код: Выделить всё

  const CollapseWrapper = styled.div`
display: flex;
background-color: #cacaca;
border-bottom: 1px solid black;
user-select: none;
width: 1750px;
::after {
content: "";
position: fixed;
width: 140px;
height: 100%;
right: 0;
top: 0;
pointer-events: none;
box-shadow: -3px 0px 4px -2px rgba(0, 0, 0, 0.45);
}
`;

Справочник по кодам и справочнику [https://codesandbox.io/p/sandbox/busy-n ... le-pxcf5jø
Проблема Посмотрите на правую сторону чуть ниже ценой. Должен быть коробка тени

ожидаемый выход


Подробнее здесь: https://stackoverflow.com/questions/794 ... ble-header