How can I change the position of the side bar to right?

Viewed 174

https://codepen.io/darkz/pen/BGawva

I am working on creating a sidebar in React. I used right: 0 style for the .menu, but it still appears on the left side. What am I missing?

2 Answers

You can use margin-left:auto and margin-right:0 to push things on right. And remember to remove right:0.

In your menu css fix typo

position: absolute;

and add

right: 0;

So in the end it should look like this

.menu {
  background: #34495e;
  height: 100vh;
  width: 250px;
  opacity:0; 
  position: absolute;
  visibility: hidden;
  transition: all 0.25s ease;
  transform: translateX(50%);
  right: 0; 

It should solve your problem

Related