Q:

Add row clearfix after evry three column does any one know how to make it using view?

<div class="blog-categories-warp">
     <div class="container">
         <div class="row clearfix">
             <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
                 <h3>General</h3>
                    <ul class="archive-list">
                     <li>
                         <a href="#">Diam mus suspendisse eu sed in senectus ut a cum.<span>on 24 April, 2016</span></a>
                        </li>
                        <li>
                         <a href="#">Litora augue parturient suspendisse ullamcorper fermentum velit aliquet augue ullamcorper lobortis.<span>on 24 April, 2016</span></a>
                        </li>
                    </ul>
                    <div class="more-in-blog"><a href="#">More in General</a></div>
                </div>
                <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
                 <h3>Selerisque sceler</h3>
                    <ul class="archive-list">
                     <li>
                         <a href="#">Diam mus suspendisse eu sed in senectus ut a cum.<span>on 24 April, 2016</span></a>
                        </li>
                        <li>
                         <a href="#">Litora augue parturient suspendisse ullamcorper ferrtis.<span>on 24 April, 2016</span></a>
                        </li>
                    </ul>
                    <div class="more-in-blog"><a href="#">More in General</a></div>
                </div>
                <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
                 <h3>Hac ad sagittis</h3>
                    <ul class="archive-list">
                     <li>
                         <a href="#">Diam mus suspendisse eu sed in senectus ut a cum.<span>on 24 April, 2016</span></a>
                        </li>
                        <li>
                         <a href="#">A ultricies litora habitasse eget condimen <span>on 24 April, 2016</span></a>
                        </li>
                        <li>
                         <a href="#">Scelerisque parturient vestibulum scelerisqu. <span>on 24 April, 2016</span></a>
                        </li>
                        <li>
                         <a href="#">Litora augue parturient suspendisse ullamcorper ferrtis.<span>on 24 April, 2016</span></a>
                        </li>
                    </ul>
                    <div class="more-in-blog"><a href="#">More in General</a></div>
                </div>
            </div>
            <div class="row clearfix">             
                <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
                 <h3>Selerisque sceler</h3>
                    <ul class="archive-list">
                     <li>
                         <a href="#">Diam mus suspendisse eu sed in senectus ut a cum.<span>on 24 April, 2016</span></a>
                        </li>
                        <li>
                         <a href="#">A ultricies litora habitasse eget condimen <span>on 24 April, 2016</span></a>
                        </li>
                        <li>
                         <a href="#">Scelerisque parturient vestibulum scelerisque dictum a jisse gravida curae at. <span>on 24 April, 2016</span></a>
                        </li>
                        <li>
                         <a href="#">Scelerisque parturient vestibulum scelerisque dictumt fringilla. <span>on 24 April, 2016</span></a>
                        </li>
                        <li>
                         <a href="#">Litora augue parturient suspendisse ullamcorper ferrtis.<span>on 24 April, 2016</span></a>
                        </li>
                    </ul>
                    <div class="more-in-blog"><a href="#">More in General</a></div>
                </div>
                <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
                 <h3>Hac ad sagittis</h3>
                    <ul class="archive-list">
                     <li>
                         <a href="#">Diam mus suspendisse eu sed in senectus ut a cum.<span>on 24 April, 2016</span></a>
                        </li>
                       <li>
                         <a href="#">Litora augue parturient suspendisse ullamcorper ferrtis.<span>on 24 April, 2016</span></a>
                        </li>
                    </ul>
                    <div class="more-in-blog"><a href="#">More in General</a></div>
                </div>
                <div class="col-lg-4 col-md-4 col-sm-4 col-xs-12">
                 <h3>General</h3>
                    <ul class="archive-list">
                    <li>
                         <a href="#">Diam mus suspendisse eu sed in senectus ut a cum.<span>on 24 April, 2016</span></a>
                        </li>
                    </ul>
                    <div class="more-in-blog"><a href="#">More in General</a></div>
                </div>
            </div>
        </div>
    </div>

I am trying to make structure of html like this using view 
and i also make views but i can't add <div class="row clearfix"> at the every third column can any one help me out?
I'm using Drupal 7, Views 3 

A:

Probably not what you thought you'd get, but here's a CSS selector that can do this fix for you, no preprocessing needed:
.blog-categories-warp > .container > .row:nth-child(3) {
  background: green;
}

Note: As of writing, 97.22% of the browsers in the world would support this CSS selector: http://caniuse.com/#search=nth

I'm interested because your code given doesn't actually give us three rows. So I had to add some to make sure my CSS worked. It does.

Here's the CSS snippet that adds bootstrap's clearfix hack:
.blog-categories-warp > .container > .row:nth-child(3):before,
.blog-categories-warp > .container > .row:nth-child(3):after {
  content: " "; /* 1 */
  display: table; /* 2 */
}
.blog-categories-warp > .container > .row:nth-child(3):after { clear: both; }
/* For IE 6/7 only */
.blog-categories-warp > .container > .row:nth-child(3) {
  *zoom: 1;
}

And here's a working example:
http://codepen.io/anon/pen/PNzyNw

