'Stats page using flexbox

Hi! Good Work there... Your problem was the usage of an extra div this is where i removed the extra div and changed class .remove_padding to .card_content. I also removed the top div but you can add it if you want but then it will be consider as a single element unlike separate h1 and p.

<div class="card-container">
          <div class="card-content">
              <h1>Get <span>insights</span> that help your business grow.</h1>

              <p>
                Discover the benefits of data analytics and make better
                decisions regarding revenue, customer experience, and overall
                efficiency.
              </p>

            <div class="flex-container stats">
              <div class="stats-one">
                <h2>10k+</h2>
                <p class="stats-p">companies</p>
              </div>

              <div class="stats-two">
                <h2>314</h2>
                <p class="stats-p">templates</p>
              </div>

              <div class="stats-three">
                <h2>12m+</h2>
                <p class="stats-p">queries</p>
              </div>
            </div>
            
          </div>
        
        
        <div class="p-flex-item part-two">
          <img src="./images/image-header-desktop.jpg" class="image" ; />
        </div>
      </div>

CSS is of .card-content and image is as follow where i changed flex:1; because it will give equal size both to image and .card-content.

.image {
  width: 100%;
  height: 100%;
  flex: 1;

}

.card-content {
  padding: 60px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex: 1;
}

You can also check my solution here GitHub Link. I hope this will be helpful for you.

Regards #SAAD

uhm i think the problem in your .for-padding was the height wasn't enough for it to do a justify-content. you can declare the height to 100% first then your justify content will work. hope this can help.