JSFiddle - React, Tailwind, and code Playground

by Dominik Wilk

HTML

<div class="kontener">
   <div class="sidebar">
     sidebarsid ebarsideb arsidebarsi debar
     sidebarsidebar
   </div>
   <div class="content">content</div>
</div>

SCSS

* {
  box-sizing: border-box;
}

.kontener {
  display: flex;
  flex-wrap: wrap;
}

.sidebar {
  flex: 0 0 100px;
  background: blue;
  color: #fff;
}

.content {
  flex: 1;
  background: red;
  color: #fff;
}

@media screen and (max-width: 330px) {
  .content {
    order: -1;
    flex: 1 1 100%;
  }
  
  .sidebar {
    flex: 1 1 100%;
  }
}