I've enabled the responsive feature in twitter bootstrap, using nested fluid grid. When viewed on small mobile, every single spans are stacked. However, I'd like to keep the "maincontent" unstacked and shown in horizontal layout. I've tried display:inline-block; and min-width but both didn't work. Any recommendations? Thank you.
<div class="container-fluid">
<div class="row-fluid">
<div class="span9" id="maincontent">
<div class="container-fluid">
<div class="row-fluid">
<div class="span2">2</div>
<div class="span8">8</div>
<div class="span2">2</div>
</div>
</div>
</div>
<div class="span3" id="sidebar">
<!-- sidebar elements go here -->
</div>
</div>
</div>
See Question&Answers more detail:os