0

Below is part of html and CSS of the menu bars.

I want to put the menu bars in the right side. I know the actual menu bars are the blank contents with the background color. I have no idea about putting those contents to the right.

function myFunction(x) {
  x.classList.toggle("change");
}
.container {
  display: inline-block;
  cursor: pointer;
}

.bar1,
.bar2,
.bar3 {
  width: 40px;
  height: 5px;
  background-color: gainsboro;
  margin: 6px;
  transition: 0.4s;
}

.change .bar1 {
  -webkit-transform: rotate(-45deg) translate(-9px, 6px);
  transform: rotate(-45deg) translate(-9px, 6px);
}

.change .bar2 {
  opacity: 0;
}

.change .bar3 {
  -webkit-transform: rotate(45deg) translate(-8px, -8px);
  transform: rotate(45deg) translate(-8px, -8px);
}
<div class="container" onclick="myFunction(this)">
  <div class="bar1"></div>
  <div class="bar2"></div>
  <div class="bar3"></div>
</div>
mplungjan
  • 155,085
  • 27
  • 166
  • 222
Seong Ho Park
  • 1
  • Welcome to Stack Overflow! Please visit [help], take [tour] to see what and [ask]. ***>>>[Do some research](https://www.google.com/search?q=css+right+align+div+site%3Astackoverflow.com)<< – mplungjan Mar 28 '21 at 15:28
  • does class `.container` have a parent? – s.kuznetsov Mar 28 '21 at 15:31

0 Answers0