Как сделать,чтобы элемент одновременно имел position:absolute и position:sticky как на фото?

Question

[lololoshka2010]

https://imgur.com/a/6YINklK
как сделать, чтобы было position:absolute и одновременно с этим родитель, у которого display flex,учитывал элемент с position:absolute

Comments

[strelok011]

Так не бывает.
Если трудности с пониманием поведения атрибутов - опишите прямо необходимое поведение.
Одновременно два значения у position не работает и если стоит что-то аналогичное absolute - подразумевается что объект вырван из потока и родитель не будет знать о его свойствах. Максимум - у родителя стоит position: relative и вложенный объект сможет позиционироваться относительно родителя.

[lololoshka2010]

strelok011, да я знаю,мне вопрос удаляют,если я нормально излагаюсь.Как сделать,чтобы элемент наклыдвался на другой как при абсолютном позиционировании и при этом все элементы учитывают его при рендере и не смещаются влево

[wadowad]

lololoshka2010, position: fixed. А отступы от краёв окна посчитать по родителю возможностями js.

[strelok011]

тут как бы да - надо следить за размерами фиксированного элемента, вырванного из потока. Если он всегда определен - прописать отступ при его поведении просто стилями, если он растягивается - писать на js слушатель размеров этого контейнера. одним css этого никогда не добиться

[strelok011]

*не поведении а появлении

Answer 1

[cssfish]

тут может и нет absolute вообще.
карточка сама по себе - элемент flex-контейнера. А то что на скрине, при ховере - ее внутренник. Позиционируем относительно карточки, а уж absolute или нет - по вкусу

Answer 2

[123141324]

.вашClass {
position: ВашеПозиционирование;
top: 0px;
}
#ВашId {
position: ВашеПозиционирование;
top: 0px;
}