JSFiddle - React, Tailwind, and code Playground

by Thielicious

HTML

<header>
  <h1>Curried Chicken in Coconut Milk</h1>
  <p> Thai curries are quick &amp; easy to prepare, especially now that most supermarkets sell authentic ready-made curry pastes flavoured with chilli, ginger, garlic, lemon grass &amp; spices.</p>
  <p> Serves 4-6 </p>
</header>


<section id="ingredients">
  <h2> Ingredients: </h2>
  <ul>
    <li> 1 tablespoon sunflower oil </li>
    <li> 4 skinless chicken breast fillets, sliced </li>
    <li> 1 large onion, finely chopped </li>
    <li> 2 garlic cloves, finely chopped </li>
    <li> 1 tablespoon freshly grated root ginger </li>
    <li> 1 large red pepper, deseeded and chopped roughly </li>
    <li> 3 carrots, peeled and chopped roughly </li>
    <li> 2 tablespoons Thai red curry paste </li>
    <li> 1/2 pint
      <!-- insert span here -->(300 ml) chicken stock </li>
    <li> 14 oz (400g) can coconut milk </li>
    <li> 2 tablespoons caster sugar </li>
    <li> good pinch salt </li>
    <li> juice of 1 lime </li>
    <li> chopped fresh coriander leaves, to garnish </li>
    <li> Thai fragrant or basmati rice, to serve </li>
  </ul>
</section>

<section id="method">
  <h2> Method: </h2>
  <ol>
    <li> Heat a wok until very hot. Add the oil and heat until it is almost smoking, swirling around the sides. Tip in the chicken breast and cook for a few minutes, until lightly browned.</li>
    <li> Add the onion, garlic and ginger to the wok and cook for another 3-4 minutes, until softened. Add the red pepper and carrot. Stir in the curry paste and cook for 2 minutes, stirring continuously. Pour in the chicken stock and coconut milk and bring
      to a gentle simmer. Stir in the sugar and salt.</li>
    <li> Add enough lime juice to taste and simmer gently for 10-15 minutes, until the sauce has slightly reduced and the chicken is completely tender.</li>
    <li> To serve, divide among warmed wide-rimmed bowls &amp; sprinkle over the coriander, then serve with the Thai fragrant or basmati rice
    </li>
 ...

CSS

body {
   font-family: Calibri, sans-serif;
   background-color: #CAFEB8;
 }
 
 header {
   border: 1px solid black;
   background-color: #89FC63;
   margin: 1%;
   padding: 0 10px;
 }
 
 #ingredients {
   border: 1px solid black;
   background-color: #B4D1B6;
   height: 60%;
   width: 45%;
   float: left;
   margin: 1%;
   padding: 10px;
 }
 
 #method {
   border: 1px solid black;
   background-color: #FFFF99;
   height: 70%;
   padding: 10px;
   margin: 1%;
   width: 45%;
   float: right;
   display: inline-block;
 }
 
 #footer {
   border: 1px solid black;
   margin: 1%;
   background-color: #AAFD8E padding-left: 10px;
   padding: 0 10px 0 0;
   clear: left;
 }