Выровняйте фиксированный элемент div справа вверху переменной ширины TD

Question

У меня есть проект, в котором мне нужно выровнять div по правому краю так, чтобы он располагался поверх существующей переменной ширины td.

Что меня озадачило, так это аспект переменной ширины. Я могу заставить div сидеть поверх существующего относительно позиционированного td, используя фиксированное позиционирование для div. Однако, поскольку ширина TD может измениться, я не могу установить значение "left:" для div.

Я создал скрипку, чтобы продемонстрировать ее с выравниванием по левому краю в td, теперь мне просто нужно выровнять его по правому краю:

jsfiddle.net/ErDr6/36/

Я посмотрел на некоторые другие сообщения, но они, кажется, имеют дело с элементами фиксированной ширины:

Совместите div с фиксированным положением на правой стороне

Answer 1

Во-первых, изменить position: fixed; в position: absolute; чтобы стрелки не оставались неподвижными относительно области просмотра при прокрутке страницы. Затем добавьте следующее:

#col_arrow {
    right: 0;
}
.wc-day-column-header {
    position: relative;
}

Это выровняет стрелку справа от его родителя. Мы добавляем position: relative; к родителю, чтобы ограничить его этим контейнером.

Answer 2

Если он должен быть динамическим, то абсолютная позиция может быть рассчитана как:

theTD.offsetLeft + theTD.offsetWidth-arrow.offsetWidth