JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<div class="row ml-3">
<div class="col-sm-4 sidebar-outer">
<div class="sidebar">fixed sidebar
<h1>dewa</h1></div>
</div>
<div class="col-sm-8">
<div class="content">fluid content
<h1>Content</h1>
<h1>Content</h1>
<h1>Content</h1>
<h1>Content</h1>
<h1>Content</h1>
<h1>Content</h1>
<h1>Content</h1>
<h1>Content</h1>
<h1>Content</h1>
<h1>Content</h1>
<h1>Content</h1>
<h1>Content</h1>
<h1>Content</h1>
</div>
</div>
</div>
CSS
.row {
margin-top:10px;
margin-left : 50px
}
.sidebar-outer {
position: relative;
}
.sidebar {
background-color: red;
}
.content {
background-color: lightblue;
}
@media (min-width: 768px) {
.sidebar {
position: fixed;
}
}