JSFiddle - React, Tailwind, and code Playground

by ninachroscicka

HTML

<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Raleway" />


<div class = "all" style="display: inline-block;">
  <div class = "part1" style="width:300px;">
  <div class="column">
    <p>Dieta</p>
  </div>
  <div class="column">
    <p>Jedzenie</p>
  </div>
</div>

<div class = "part2" style="width:300px;">
  <div class="column">
    <p>Zdrowejedzenie</p>
  </div>
  <div class="column">
    <p>Instafood</p>
  </div>
</div>

</div>

CSS

.part1 {
  float:left;
}

.part2 {
  float:right;
}

.all {
  border: 5px solid #d49793;
  /*box-shadow: 0px 0px 0px 8px #d49793;*/
  border-radius: 16px;
  font-family: Raleway;
  box-shadow: 5px 5px 5px #E9CBC9;
  /*font-weight:400;*/
  /*border-style: dashed;*/
}