JSFiddle - React, Tailwind, and code Playground

by Kirubel Girma

HTML

<div class="maxsrv">
  <div class="srvcont">
    <img src="https://image.ibb.co/nsGEg5/services.png" alt="" class="srvimg">
    <div class="srvcont1">
      <h1 class="srvh">Mobile App Development</h1>
      <p class="srvp">Design and Development from one dedicated team. Perfect for building a minimum viable product.</p>
    </div>
  </div>

  <div class="srvcont">
    <img src="https://image.ibb.co/nsGEg5/services.png" alt="" class="srvimg">
    <div class="srvcont1">
      <h1 class="srvh">Project Based Development</h1>
      <p class="srvp">Need additional bandwidth for a project? Get a team dedicated to your temporary or non-core projects.
      </p>
    </div>
  </div>

  <div class="srvcont">
    <img src="https://image.ibb.co/nsGEg5/services.png" alt="" class="srvimg">
    <div class="srvcont1">
      <h1 class="srvh">Languages</h1>
      <p class="srvp">We speak your language – Rails, PHP, NodeJS, Angular, Java
      </p>
    </div>
  </div>

  <div class="srvcont">
    <img src="https://image.ibb.co/nsGEg5/services.png" alt="" class="srvimg">
    <div class="srvcont1">
      <h1 class="srvh">Web Development
</h1>
      <p class="srvp">Build a modern, responsive website for your brand or business – WordPress, Drupal, SquareSpace, and more.
      </p>
    </div>
  </div>

  <div class="srvcont">
    <img src="https://image.ibb.co/nsGEg5/services.png" alt="" class="srvimg">
    <div class="srvcont1">
      <h1 class="srvh">Ecommerce Solutions
</h1>
      <p class="srvp">Building an online store for your business? Our team is experienced across all platforms such as – WooCommerce, Magento, Shopify, and more.
      </p>
    </div>
  </div>

  <div class="srvcont">
    <img src="https://image.ibb.co/nsGEg5/services.png" alt="" class="srvimg">
    <div class="srvcont1">
      <h1 class="srvh">UX/UI
</h1>
      <p class="srvp">Build great products. We provide wire framing, interfaces, and user experiences designed to build products that last.
      </p>
   ...

CSS

body {
  font-family: arial;
  height:100%;
  width:100%;
  position: absolute;
  
  display: flex;
  justify-content: center;
}
.maxsrv{
  max-width: 100em;
  height: 100%;
  background-color: green;
}
.srvcont {
  float: left;
  margin: 1em;
  background-color: red;
}
.srvcont1 {
  display: inline-block;
  max-width: 23em;
  height: 7em
}
.srvimg {
  height: 3.2em;
  width: 3.2em;
  margin-right: 1em;
  vertical-align: top;
}
.srvh {
  margin: 0em;
  font-size: 1.4em;
}
.srvp {
  margin: 0em;
  padding-top: .4em;
}