On the setting height and width of the banner image get cropped?

Question

<style type="text/css">
  .slide {
    padding-right: 10px;
    padding-left: 10px;
    background-image: -webkit-linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), url(../images/banner01.jpg);
    background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 0)), url(../images/banner01.jpg);
    background-position: 0% 0%, 50% 50%;
    background-size: 1200px 400px;
    background-repeat: repeat, no-repeat;
  }
</style>
<div class="banner" style="height: 400px;">
  <div class="banner-content">
    <div class="w-container">
      <div class="w-hidden-tiny banner-small-title">Data / Technology / Solution</div>
      <div class="banner-big-title" style="color:#00CCFD;">We are proud to assist you</div>
      <div class="banner-sub-text" style="color:#fff;">Total Solution To Get You Started!</div>
      <div class="call-to-action-wrapper"><a class="button button-with-margin" href="about-us.html">Read More</a></div>
    </div>
  </div>
  <div class="w-slider big-slider" data-animation="over" data-duration="500" data-infinite="1" data-nav-spacing="5" data-delay="4000" data-autoplay="1">
    <div class="w-slider-mask">
      <div class="w-slide slide"></div>
      <div class="w-slide slide photo-2"></div>
      <div class="w-slide slide photo-3"></div>
    </div>
    <div class="w-slider-nav w-round slider-navigation absolute-position"></div>
  </div>
</div>

I am trying to reduced banner height by applying CSS On the setting height of banner image get cropped (innovative-fusion.com).

Your question is hard to understand. But from what I gather you need to make the `background-size: cover;` and `width: 1200px; height: 400px;` instead. — Gezzasa, Nov 29 '17 at 10:53
no, I want to reduce the height of banner it's already set to background-size: auto, cover; — Ritesh Patel, Nov 29 '17 at 10:56
So you have your first element that has a certain height. On that element is a background that you want to limit the height of? Not sure if that would be possible (Please correct if wrong). Have a look here https://stackoverflow.com/questions/1341358/set-size-on-background-image-with-css — Gezzasa, Nov 29 '17 at 11:01

On the setting height and width of the banner image get cropped?

0 Answers0