title: Bootstrap 4 carousal not making image full width
body: <p>I am using bootstrap 4 and codeigniter and for some reason the bootstrap carousal width is not working. The image is squeezed smaller when in fact the image is 1140px width</p>
  
  <blockquote>
    <p>Question how can I get the image in bootstrap carousal to show it full width and height? I use codeigniter and bootstrap together.</p>
  </blockquote>
  
  <p>As shown in image below image not full width in carousal</p>
  
  <p><a href="https://i.stack.imgur.com/orsmc.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/orsmc.png" alt="enter image description here"></a></p>
  
  <pre><code>&lt;div id="carouselExampleIndicators&lt;?php echo $module; ?&gt;" class="carousel slide" data-ride="carousel"&gt;
  
      &lt;ol class="carousel-indicators"&gt;
      &lt;?php foreach ($banners as $i =&gt; $banner) { ?&gt;
          &lt;li data-target="#carouselExampleIndicators&lt;?php echo $module; ?&gt;" data-slide-to="&lt;?php echo $i; ?&gt;"&lt;?php echo !$i ? ' class="active"' : ''; ?&gt;&gt;&lt;/li&gt;
      &lt;?php } ?&gt;
  
      &lt;/ol&gt;
  
      &lt;div class="carousel-inner"&gt;
  
      &lt;?php foreach ($banners as $i =&gt; $banner) { ?&gt;
          &lt;div class="carousel-item &lt;?php echo !$i ? ' active' : ''; ?&gt;"&gt;
              &lt;img class="w-100" src="&lt;?php echo $banner['image']; ?&gt;" alt=""&gt;
          &lt;/div&gt;
      &lt;?php } ?&gt;
  
      &lt;/div&gt;
  
      &lt;?php if (count($banners) &gt; 1) { ?&gt;
      &lt;a class="carousel-control-prev" href="#carouselExampleIndicators&lt;?php echo $module; ?&gt;" role="button" data-slide="prev"&gt;
          &lt;span class="carousel-control-prev-icon" aria-hidden="true"&gt;&lt;/span&gt;
          &lt;span class="sr-only"&gt;Previous&lt;/span&gt;
      &lt;/a&gt;
  
      &lt;a class="carousel-control-next" href="#carouselExampleIndicators&lt;?php echo $module; ?&gt;" role="button" data-slide="next"&gt;
          &lt;span class="carousel-control-next-icon" aria-hidden="true"&gt;&lt;/span&gt;
          &lt;span class="sr-only"&gt;Next&lt;/span&gt;
      &lt;/a&gt;
      &lt;?php } ?&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>Controller</p>
  
  <pre><code>&lt;?php 
  
  class Slideshow extends MX_Controller {
  
      public function index($setting = array()) {
  
          static $module = 0;
  
          $this-&gt;load-&gt;model('catalog/tool/image_model');
  
          $data['width'] = $setting['width'];
          $data['height'] = $setting['height'];
  
          $results = $this-&gt;getBanner($setting['banner_id']);
  
          $data['banners'] = array();
  
          foreach ($results as $result) {
              $data['banners'][] = array(
                  'image' =&gt; $this-&gt;image_model-&gt;resize($result['image'], $setting['width'], $setting['height'])
              );
          }
  
          $data['module'] = $module++;
  
          if (file_exists(config_item('catalog_template_path') . $this-&gt;site-&gt;get('config_theme') . '/template/module/slideshow_view.php')) {
              $this-&gt;load-&gt;view($this-&gt;site-&gt;get('config_theme') .'/template/module/slideshow_view', $data);
          } else {
              $this-&gt;load-&gt;view('default/template/module/slideshow_view', $data);
          }
      }
  
      public function getBanner($banner_id) {
          $this-&gt;db-&gt;select('*');
          $this-&gt;db-&gt;from($this-&gt;db-&gt;dbprefix . 'banner');
          $this-&gt;db-&gt;join($this-&gt;db-&gt;dbprefix . 'banner_image', 'banner_image.banner_id = banner.banner_id', 'LEFT');
          $this-&gt;db-&gt;where('banner_image.banner_id', $banner_id);
          $query = $this-&gt;db-&gt;get();
  
          return $query-&gt;result_array();
      }
  }
  </code></pre>