JSFiddle - React, Tailwind, and code Playground
HTML
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.2/css/bootstrap.min.css">
<div class="mainContent">
<div class="workplace_outter">
<div class="workplace_inner">
<div class="panel panel-default">
<div class="panel-heading">
Item
</div>
<div class="panel-body">
Item Body....
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
Item
</div>
<div class="panel-body">
Item Body....
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
Item
</div>
<div class="panel-body">
Item Body....
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
Item
</div>
<div class="panel-body">
Item Body....
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
Item
</div>
<div class="panel-body">
Item Body....
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
Item
</div>
<div class="panel-body">
Item Body....
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
Item
</div>
<div class="panel-body">
Item Body....
</div>
</div>
...
CSS
html, body {
height: 100%;
min-height: 100%;
}
.mainContent{
height: 100%;
}
.workplace_outter{
width:100%;
height: 100%;
}
.workplace_inner{
width: 2000px;
display: inline-block;
height: 100%;
font: 0/0 a;
white-space: nowrap;
}
.workplace_outter .panel{
width:300px;
margin-right : 5px;
display:inline-block;
height: 100%;
}
.panel {
/*like body*/
font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
font-size: 14px;
line-height: 1.428571429;
}