JSFiddle - React, Tailwind, and code Playground

by vinishanto

HTML

<div class="wrapper">
    <div class="header">head</div>
    <div class="body">
        <div>
            <div>
                  <div class="row">
                        <div class="wrapper">
                          <div class="header">head</div>
                          <div class="body">
                              <div>
                                  <div>
                                    <div class="buug">
                                        <div class="row">
                                            another
                                        </div>
                                      </div>
                                  <div>
                                  <div class="row">
                                  hello
                                  </div>
                              </div>
                          </div>
                      </div>
                  </div>
                </div>
                </div>
            <div>
            <div class="row">
            hello
            </div>
        </div>
    </div>
</div>

CSS

.wrapper {
  width: 100%;
  padding: 20px;
}
 .wrapper .header {
    border: 1px solid red;
    min-height: 40px;
    width: 100%;
  }
  .wrapper .body .row {
    border: 1px solid red;
    border-top: none;
    min-height: 20px;
    width: 100%;
  }
  .bug {
    margin: 10px;
  }