Bootstrap Carousel Image Not Display in Full Width

In your css

.carousel-inner>.item>img, .carousel-inner>.item>a>img {
display: block;
height: auto;
max-width: 100%;
line-height: 1;
width: 100%; // Add this
}

This is because bootstrap doesn't align crousel content to center

you have 2 options

1. Make changes in CSS and align it center

.carousel-inner > .item > img, .carousel-inner > .item > a > img {
    display: block;
    height: auto;
    line-height: 1;
    margin: 0 auto;
    max-width: 100%;
}

2. instead of in div use background image like

   <div class="item">
       <div style="background-image: url(img/4.jpg); height: 400px;background-size: contain; margin: 0px auto; width: 95%;">
       </div>
   </div>