html - why does bootstrap carousel take margin on its left and right side automatically? -
i trying make carousel full screen. means need carousel 100% wide literally. leaving place on left , right side. other elements working fine. here image:
my code is:
<div class="container-fluid"> <div id="mycarousel" class="carousel slide" data-ride="carousel"> <div class="carousel-inner" role="listbox"> <div class="item active"> <img src="images/slide-1.jpg" alt="" /> </div> <div class="item"> <img src="images/slide-2.jpg" alt="" /> </div> <div class="item"> <img src="images/slide-3.jpg" alt="" /> </div> </div> </div> <div style="width: 100%; height: 300px; background: #990000;"> </div> </div>
how remove these unwanted margins?
this because .container have padding-right: 15px; padding-left: 15px; need create new class overwrite making padding-right: 0; padding-left: 0;
<div class="container-fluid header"> ... </div>
.header {padding-right: 0; padding-left: 0;}
Comments
Post a Comment