Stats Preview Card Component Main

Community feedback

• 

  MrDeveloper01010•240

  @istfredyPosted over 1 year ago

  Hello, That's an excellent code😀

  You can see that your image quality is not very good. To change this, I suggest you use the Flexbox Template on your card container. Look at this:

  html

  <section>
  <! ---- Your div here ----> 
  <figure>
     <img src="" class="desktop-img">
     <img src="" class="mobile-img">
      <div class="violet-bg-container"></div>
  </figure>
  </section>
  
  

  css

  section {
  display:flex;
  width:#Your width#;
  }
  figure{
  width:50%;
  height:100%;
  position:relative;
  }
  
  figure img{
  width:100%;
  height:100%;
  border-radius: 0 6px 6px 0;
  }
  
  /* You are supposed to put one of the two images on ````display:none;```` depending on the width of the user screen */
  
  figure div.violet-bg-container{
  position:absolute;
  top:0;
  left:0;
  height:100%;
  width:100%;
  background-image: none;
  background-color: #Your color#;
  border-radius:0 6px 6px 0;
  }
  

  I hope this will help you. bye bye 😋

  Marked as helpful

  1