JSFiddle - React, Tailwind, and code Playground

by Zareh Geertjes

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<div class="container">
    
    <div class="row" style="height:100px; background: #fff;"> this is ok</div>
    <div class="row row-full" style="height:100px; background: #f00;">
        this should take 100% width
    </div>
</div>

CSS

/*Container style is for illustration purpose only */
.container{
 background: gray;
 min-height: 400px;
}

/*Can achive using vw css unit*/
.row-full{
      width: 100vw;
      position: relative;
      margin-left: -50vw;
      height: 100px;
      margin-top: 100px;
      left: 50%;
}