JSFiddle - React, Tailwind, and code Playground

HTML

<div>
  <button>кнопка</button>
  <ul>
    <li>это</li>
    <li>типа</li>
    <li>меню</li>
  </ul>
</div>

CSS

html, body { height: 100%; }
div {
  width: 500px;
  height: 100%;
  border: dashed 2px gray;
}
button { display: none; }
ul { width: 130px; }
li {
  border: solid 1px orange;
  padding: .3em;
}


@media (max-width: 500px) { /* магия */
  button { display: block; }
  ul { display: none; }
}