<!DOCTYPE html>
<html>
   <head></head>
   <body>
    <div class="wholething">
      <div class="container">
         <div class = "country">
           <div class = "text">
            <h2>Brazil</h2>
            <p>Brazil is in South America.</p>
           </div>
         </div>
         <div class = "country">
           <div class = "text">
            <h2>Germany</h2>
            <p>Germany is in Europe.</p>
           </div>
         </div>
         <div class = "country">
           <div class = "text">
            <h2>India</h2>
            <p>India is in Asia.</p>
           </div>
         </div>
      </div>
      </div>
     </div>
   </body>
</html>



.country {
  border-style: solid;
  border-width: 2px 2px 2px 2px;
  border-color: green;
  margin: 10px 10px 10px 10px;
  text-align: center;
  background-color: orange;
  
}
.container{
  display:inline-block;
}
.text{
  margin: 10px 10px 10px 10px;
  color: white;
}
.wholething{
  text-align:center;
  color: blue;
}



External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.