Александр Цымбал, полно статей про позиционирование, почитайте что делают fixed, absolute, про поток документа, слои, как браузер всё это рисует и перерисовывает при изменениях.
Ничего плохого в них нет, если использовать по назначению и когда нет других вариантов.
В вашем решении, нужно к этому ещё и js прикрутить, чтобы узнать высоту и передать её в отступы.
Так, погодите.
Если про pdf речь идет про обычную печать в pdf, то у вас проблемы не с флексами.
Потому что и гриды с флексы прекрасно понимаются.
И проблема у вас исключительно в том, чем вы печатаете pdf. Например, foxit или обычное "сохранить как pdf" прекрасно с этим справляется.
Например, такая логика (можете поменять на свою)
1. Выбрать элементы (на которые hover)
2. Написать цикл, в котором
3. повесить обработчики событий
4. Выбрать элемент, у которого нужно менять фон (или просто найти его по селектору или по родственным связям)
5. Сменить у найденного кастомное свойство.
По дороге придумать, где хранить значение этого кастомного. Например, в data-атрибуте элементов, на которые наведение.
Вот сайт, на котором можно посмотреть анимацию, которую я хочу повторить. https://outside.digital/
Там же, в инструментах разработчика, можно посмотреть как сделано у них.
И это не единственный вариант.
Какие проблемы у вас возникли со сменой цвета не очень понятно.
Картинку можно менять, например, в псевдоэлементе прибитом куда нужно с помощью absolute|fixed. Или менять фон у body (в сочетании с bg attachment)
Можно при наведении на слово менять класс всему блоку на JS. Классу прописывать картинку. Можно менять не класс, а инлайново менять значение кастомного свойства.
Anton, тогда варианты:
1. задать еще + тень, которая перекрое белый фон
2. убрать белый фон у обертки и задавать его контенту ниже
3. задать border-radius обертке с белым фоном
4. заменить белый фон на градиент с верхней голубой полоской
Ничего плохого в них нет, если использовать по назначению и когда нет других вариантов.
В вашем решении, нужно к этому ещё и js прикрутить, чтобы узнать высоту и передать её в отступы.