Creating a grid with two section in a single container

Issue

I am working on a project and trying to create a grid with two section in a single container . In one section, contact us and on other section jobs, I tried many time but could not find the issue with code. Can someone please help as i am new to this and stuck on same from 1 week ? Any help will be appreciated.

Regards

.work-bottom {
 width: 20%;
 padding: 50px 100px 60px;
 text-align: center;
 color: #ffffff;
 margin: 0px !important;
 }
 .work-bottom .title {
 color: #ffffff;
 font-size: 29px;
 }
 .work-bottom .desc {
 margin: 30px 0px 40px 0px;
 font-size: 15px;
 }
 .work-bottom .contact-btn {
 color: #ffffff;
 border: solid 1px;
 padding: 10px 36px;
 font-size: 17px;
 font-family: 'Montserrat';
 transition: 0.2s;
 border-radius: 2px;

 }
 .work-bottom .contact-btn:hover {
 background: #ffffff;
border: none;
 }
 .work1 {
 background: #0d4c8f;
 }
 .work1 .contact-btn:hover{
 color: #0d4c8f;
 }
 .work2 {
 background: #6e8e3b;
 }

 .work2 .contact-btn:hover{
 color: #6e8e3b;
 }
 .work-content {
 max-width: 330px;
 line-height: 20px
 }
 .right-flow {
 margin: 0 0 0 auto ;
 }
@media all and (max-width: 980px) {
 .work-content{
 margin: 0 auto;
 }
}
@media all and (max-width: 768px) {
 .work-bottom{
 padding: 50px 30px 60px 
 }
 .work-bottom .title {
 font-size: 22px;
 }
.work-bottom .contact-btn{
 font-size: 18px;
}
}

<div class="row">
<div class="work-bottom work1 et_pb_column">
 <div class="work-content right-flow">
 <h2 class="title">Work with Us</h2>
 <p class="desc">conversation about what you need to succeed </p>
 <a class="contact-btn" href="/about/contact-us/">CONTACT US</a>
 </div>
</div></div>

<div class="work-bottom work2 et_pb_column">
 <div class="work-content">
 <h2 class="title">Work for Us</h2>
 <p class="desc">Explore exciting opportunities to join our team.</p>
 <a class="contact-btn" href="/about/careers/">EXPLORE JOBS</a>
 </div>
</div>
    </div>

Solution

If you are using bootstrap, you can update your html with the following code

<div class="d-flex">
  <div class="work-bottom work1 et_pb_column">
    <div class="work-content right-flow">
      <h2 class="title">Work with Us</h2>
      <p class="desc">conversation about what you need to succeed </p>
      <a class="contact-btn" href="/about/contact-us/">CONTACT US</a>
    </div>
  </div> 
  <div class="work-bottom work2 et_pb_column">
    <div class="work-content">
       <h2 class="title">Work for Us</h2>
       <p class="desc">Explore exciting opportunities to join our team.</p>
       <a class="contact-btn" href="/about/careers/">EXPLORE JOBS</a>
     </div>
   </div>
</div>

Answered By - Abdulrahman Hatem