<div class="section">
  <div class="close">X</div>
</div>

.section {
  display: flex;
  justify-content: flex-end;
  width: 40px;
  height: 50px;
  background: red;
  overflow: hidden;
}
.close {
  display: none;
  width: 40px;
  text-align: end;
}
.section.opened {
  width: auto;
  max-width: 120px;
  background: green;
}
.section.opened .close {
  display: block;
}
.close {
  cursor: pointer;
}

$('.section').on('click', function () {
  $(this).addClass('opened');
});
$('.close').on('click', function () {
  $('.section').removeClass('opened');
});