Bootstrap Carousel Haber Slider

NOt: Koldarın Düzgün bir şekilde çalışması için botstrap carousel css kodlarıda eklenmelidir.
gerekli kodlar bootsnipp carousel css kodlarının içersinde mevcuttur.





<style type="text/css">
        .kayanuruncerceve{
            background-color:#ebebeb;
            border-radius:3px;
        }
        .kayanurun{
            border:1px solid;
            border-radius:5px;
            border-color:silver;
        }

.carousel-inner .carouselresim {
    width: 100%;
    max-height: 250px
}
.icresim{
    width:10%;
    height:150px;
    border-radius:50%;
    border:2px solid;
    border-color:#bb1634;
}

/* Carousel Header Styles */
.header-text {
    position: absolute;
    top: 20%;
    left:10px;
    right: auto;
    width: 96.66666666666666%;
    color: #fff;
}
.pl0{
    padding-left:0px;

}
.haberbg{
    width:100%;
    height:100px;
    display: table-cell;
 vertical-align: middle;
 text-align: center;
    
   
}

.header-text h3{
 background-color:#000;
 padding: 2px;
    font-size: 20px;
    border-radius:10px;
   
}


</style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
   <div class="container ">
    </div>
    
     <div class="container">
    
 <div class="row">
     <div class="col-md-9">
  <!-- Carousel -->
     <div id="carousel-example-generic" class="carousel slide" data-ride="carousel">
   <!-- Indicators -->
   <ol class="carousel-indicators">
      <li data-target="#carousel-example-generic" data-slide-to="0" class="active"></li>
       <li data-target="#carousel-example-generic" data-slide-to="1"></li>
       <li data-target="#carousel-example-generic" data-slide-to="2"></li>
   </ol>
   <!-- Wrapper for slides -->
   <div class="carousel-inner">
       <div class="item active">
        <img class="carouselresim" src="images/news.png" alt="First slide">
                    <!-- Static Header -->
                   
                    <div class="header-text hidden-xs">
                        <div class="col-md-3"><img class="icresim" src="images/hakkımızda.jpg" /></div>
                        <div class="col-md-9 text-center pl0">
                             
                           
                          
                            <h3>
                             
                                    <div class="haberbg">2222222222Lore2222222222Lorem ipsum dolor sit amet,m ipsum dolor sit amet, consectetur adipiscing elit.</div>

                      
                            </h3>
                            <br>
                         </div>
                    </div><!-- /header-text -->
       </div>

       <div class="item">
        <img class="carouselresim" src="images/news.png" alt="Second slide">
        <!-- Static Header -->
                     
                    <div class="header-text hidden-xs">
                        <div class="col-md-3"><img class="icresim" src="images/hakkımızda.jpg" /></div>
                        <div class="col-md-9 text-center pl0">
                    
                           
                        
                            <h3>
                            
                                    <div class="haberbg">2222222222Lorem ipsum dolor sit 2222222222Lorem ipsum dolor sit amet,amet, consectetur adipiscing elit.</div>
                            
                            </h3>
                            <br>
         
                        </div>
                    </div><!-- /header-text -->
       </div>
   
   </div>
   <!-- Controls -->
   <a class="left carousel-control" href="#carousel-example-generic" data-slide="prev">
       <span class="glyphicon glyphicon-chevron-left"></span>
   </a>
   <a class="right carousel-control" href="#carousel-example-generic" data-slide="next">
       <span class="glyphicon glyphicon-chevron-right"></span>
   </a>
  </div><!-- /carousel -->
  </div>
 </div>
</div>