JSFiddle - React, Tailwind, and code Playground

by ibcLee

HTML

<div class="demo2">
  <div class="left">left</div>
  <div class="right-fix">
    <div class="right">
      <p>right</p>
      <p>right</p>
    </div>
  </div>
</div>

SCSS

@mixin common{
  line-height: 100px;
  height: 100px;
  text-align: center;
  color: white;
}
.demo2{
  @include common;
  .left{
    background-color: red;
    width:100px;
    float: left;
  }
  .right-fix{
    width: 100%;
    margin-left: -100px;;
    float: right;
    .right{
      margin-left: 100px;
      background-color: blue;
    }
  }
}