Боковая панель навигации, чтобы выдвинуться в диагональный div

Question

Я очень новичок в диагональных делениях и мне нужно повторить прикрепленную домашнюю страницу и меню, но я абсолютно не знаю, как. Пожалуйста, кто-нибудь может указать мне правильное направление? Я гуглил это целый день, но я не могу понять, что я на самом деле спрашиваю, поэтому я подумал, что попрошу здесь с помощью картинок, в надежде, что вы умная куча, могут дать мне несколько советов. Спасибо за чтение моей дилеммы.

Answer 1

Попробуйте клип-путь для диагонали

https://css-tricks.com/working-with-shapes-in-web-design/#shapes -clip-path

.nav {
  background-color: red;
  height: 100%;
  width: 300px;
  position: absolute;
  right: 0;
  clip-path: polygon(40% 0%, 100% 0%, 100% 100%, 0% 100%);
}