Two Column Grid Layout Responsive html css code

 Two Column Responsive Grid Layout 

यहाँ पर Two Column Responsive Grid Layout का HTML CSS Code Demo सहित दिया गया है जिसकी सहायता से दो कॉलम का ग्रिड लेआउट को आसानी से बना सकते है

Two Column Responsive Grid Layout CSS Code

/* Layout: */
.post-left {
  flex: 1;  
   border: 1px solid #eee;
}  
.post-right {
  flex: 1;
  border: 1px solid #eee;
}
/* Responsive: */
@media only screen and (min-width: 640px) {
  .layout {
    display: flex;
  }
}
.container {
  width: 100%;
  margin-right: auto;
  margin-left: auto;
  text-align:center;
}
.column {
  padding: 1em;
  margin: 10px;
  background: #fff;
 
}
.pdt-download-btn {
    display: inline-block;
    height: 46px;
    line-height: 46px;
    width: 220px;
    text-align: center;
    background-color: #fff;
    color: #000;
    font-size: 15px;
    border-radius: 26px;
    text-transform: capitalize;
    border: 1px solid #212121;
}
.fl {
    margin-top: 50%;
  margin-bottom: 50%;
  }

<div class="container">
  <div class="layout">
    <p class="column post-left">
      <img src="Paste Your Image Code Here" >
    </p>
    <p class="column post-right" role="complementary">
    <a href="#" class="pdt-download-btn fl" rel="nofollow">Free Download</a>
    </p>  
  </div>  
</div>

उपरोक्त HTML Code में image url की जगह अपने Image कोड को पेस्ट करे