How can use Bootstrap clearfix for clearing floats? -

How can use Bootstrap clearfix for clearing floats? -

i have wordpress theme in single.php page. below follows html code:

<div class="container"> <div class="row"> <div class="col-lg-8 col-md-8 col-sm-12 col-xs-12"> <div id="single-post"> single post content </div> </div> <div class="col-lg-4 col-md-4 col-sm-6 col-xs-12"> <div id="sidebar-area"> sidebar area </div> </div> </div> </div>

css code:

#single-post, #sidebar-area { margin:10px auto; background: #fff; border: 1px solid #d7d7d7; padding: 15px; }

image presentation

when single post content height shorter side bar area, of sidebar widgets goes under single content area. how can show sidebar widgets within sidebar area if sidebar taller single content using bootstrap clearfix class?

thank reply me problem solved used grid below within sidebar widget because repeated every widget , removed code , pasted within sidebar.php file , problem solved , widgets shown in sidebar area

<div class="col-lg-4 col-md-4 col-sm-6 col-xs-12"> </div>

twitter-bootstrap clearfix