JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
  <div class="controls">PLAY</div>
  <div class="name">NAME</div>
  <div class="artist">ARTIST</div>
  <div class="album">ALBUM</div>
</div>

CSS

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

.controls {
  flex: 0 0 25%;
  max-width: 25%;  
}

.name, .artist, .album {
  flex: 0 0 75%;
  max-width: 75%;
}

@media screen and (min-width: 600px) {  
  .name, .artist, .album {
    flex: 0 0 25%;
    max-width: 25%;
  }
}