JSFiddle - React, Tailwind, and code Playground

by allcaps

HTML

<div class="w-header w-header--merged">&nbsp;</div>

SCSS

.w-header {
  width: 100%;
/*   &--merged {
    background-color: green;
  } */
  .w-header--merged {
    background-color: red;
  }  
}

// Not nested works as intended.
/* .w-header--merged {
  background-color: red;
} */