"Carousel Reviews with Rating - three items"
Bootstrap 3.3.0 Snippet by xrozix

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="carousel-reviews broun-block"> <div class="container"> <div class="row"> <div id="carousel-reviews" class="carousel slide" data-ride="carousel"> <div class="carousel-inner"> <div class="item active"> <div class="col-md-4 col-sm-6"> <div class="block-text rel zmin"> <a title="" href="#">Show name</a> <div class="channelname">Channel Name</div> <p>Never before has there been a good film portrayal start now? This latest attempt at bringing the son of Zeus to the big screen is brought to us by X-Men: The last Stand director Brett Ratner. If the name of the director wasn't enough to dissuade ...</p> </div> </div> <div class="col-md-4 col-sm-6 hidden-xs"> <div class="block-text rel zmin"> <a title="" href="#">Show name</a> <div class="channelname">Channel Name </div> <p>The 2013 movie "The Purge" left a bad taste in all of our mouths as nothing more than a pseudo-slasher with a hamfisted plot, poor pacing, and a desperate attempt at "horror." Upon seeing the first trailer for "The Purge: Anarchy," my first and most immediate thought was "we really don't need another one of these." </p> </div> </div> <div class="col-md-4 col-sm-6 hidden-sm hidden-xs"> <div class="block-text rel zmin"> <a title="" href="#">Show name</a> <div class="channelname">Channel Name </div> <p>What a funny and entertaining film! I did not know what to expect, this is the fourth film in this vehicle's universe with the two Cars movies and then the first Planes movie. I was wondering if maybe Disney pushed it a little bit. However, Planes: Fire and Rescue is an entertaining film that is a fantastic sequel in this magical franchise. </p> </div> </div> </div> </div> </div> </div> </div> </div>
.broun-block { /*background: url("http://myinstantcms.ru/images/bg-broun1.jpg") repeat scroll center top rgba(0, 0, 0, 0);*/ background-color: #F1F3FA; padding-bottom: 34px; } .block-text { background-color: #fff; border-radius: 5px; box-shadow: 0 3px 0 0; color: #626262; font-size: 14px; margin-top: 27px; padding: 15px 18px; } .block-text a { color: #7d4702; font-size: 25px; font-weight: bold; line-height: 16px; text-decoration: none; text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3); } .block-text p { color: #585858; font-family: Georgia; font-style: italic; line-height: 20px; } .block-text ins { bottom: -44px; left: 50%; margin-left: -60px; } .channelname { padding: 14px 0; font-size: 18px; font-weight: bold; background:none; } .block { display: block; } .zmin { z-index: 1; } .ab { position: absolute; } .rel { position: relative; }

Related: See More


Questions / Comments: