JSFiddle - React, Tailwind, and code Playground

HTML

<div class="wrapper">
  <aside class="left">
    <div class="left one">
      <select name='selection_folder' onclick='this.form.submit();' style='width: 400px; height: 26px;'>
        <option value='0' selected>Alle Files anzeigen</option>";
        <option value='x' disabled>-------------------------------</option>
        <option value='file'>filename 1</option>
      </select>
    </div>
    <div class="left two">
      <select multiple='multiple' name='filename_with_path' onClick='this.form.submit();'>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
        <option value="xyz">xyz</option>
       ...

CSS

body {
  margin: 0;
  padding: 0;
}

.wrapper {
  display: flex;
  flex-direction: row;
  font-weight: bold;
  text-align: center;
  width: 100vw;
  height: 98vh;
}

aside.left {
  flex-basis: 400px;
}

main {
  flex: 1;                 /*  IE need this  */
  min-width: 0;            /*  Firefox need this  */
}

main,
aside.left {
  display: flex;
  flex-direction: column;
}

div:not(.wrapper) {
  margin: 5px;
  border: 2px solid black;
}

div.left.one {
  flex-basis: 30px;
}

div.left.two {
  flex-grow: 1;
  flex-shrink: 1;
  display: flex;                      /*  added instead of height: 100%  */
}

div.left.two select {
  /*height: 100%;                         removed  */
  width: 100%;
}

div.left.three {
  flex-basis: auto;
}

div.right.one {
  flex-basis: 60px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

div.right.two {
  flex-basis: auto;
  flex-grow: 1;
  flex-shrink: 1;
  max-width: 100%;
  align-self: flex-start;
  white-space: nowrap;
  overflow: auto;
}

div.right.three {
  flex-basis: auto;
}

div.right.four {
  flex-basis: auto;
}