Как сделать отражение объекта, без -webkit-box-reflect?

Question

[Денис Пабло]

У меня есть свой веб-сайт, служит пока-что как временная страничка где можно найти мои: Социальные сети и мессенджеры, но я очень странный человек поэтому пытаюсь любую мелочь сделать красивой, сам проект был написан за ночь на коленках под капотом vue. И у меня возник вопрос как сделать отражение объекта не используя относительно новое css свойство -webkit-box-reflect (ICANUSE), проблема в том что старые браузеры могут не поддерживать это свойство и пока я не удостоверюсь что это свойство будет работать на всех современных браузерах правильно использовать не очень горю желанием, сильно заинтересовался а как можно было сделать отражение без этого свойства.

вот мой сайт flexice.ru (там очень громкая музыка, советую сделать потише или отключить сайту доступ к вашей стерео системе)


само отражение используется не только всего этого параллелепипеда а ещё и у вот этой линии, просто кажется на первый взгляд что она целостная

Answer 1

[Арсений Матыцин]

Просто и дешево — дублируй элементы и трансформируй. Немного сложнее и чуть адекватнее (наверное) — с использованием SVG, в том числе используя элементы повторно по ID.

Comments

[Денис Пабло]

так а если это не svg а обычный html элемент