JSFiddle - React, Tailwind, and code Playground

by 규연 황

HTML

<ul class="list">
  <li>001</li>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
  <li class="itme02">
    <div>fdsf</div>
  </li>
</ul>

SCSS

.list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 20px;
  padding: 20px 0;
  margin: 40px;
  background: #FF6600;
  li {
    // width: 100% !important;
    height: 50px;
    background: #000000;
    &.itme02 {
      div {
        width: 400px;
      }
    }
  }
}