JSFiddle - React, Tailwind, and code Playground

by vooose

HTML

<!DOCTYPE html>
<html lang="en">

  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.css">
    <style>
    .margin-top-20{
      margin-top: 20px;
    }
      input {
        margin: 10px 0;   
        font-size:16px;
      }

      .segoe {
        font-family: 'Segoe UI'
      }

      .line-height-normal {
        line-height: normal;
      }
       
       .line-height-1-1 {
        line-height: 1.1;
      }
       .line-height-1-05 {
        line-height: 1.05;
      }

    </style>
  </head>

  <body>
    <div><input type="text" value="1 Aug 2019"><label for="">line height 1.15 Times New Roman</label></div>
    <div><input type="text" value="1 Aug 2019" class="segoe"><label for="">line height 1.15 Segoe UI</label></div>
    <div><input type="text" value="1 Aug 2019" class="segoe line-height-normal"><label for="">line height normal Segoe UI</label></div>
    
    
    <div class="margin-top-20"><input type="text" value="1 Aug 2019" class="segoe line-height-1-1"><label for="">line height 1.1 Segoe UI</label></div>
    <div><input type="text" value="1 Aug 2019" class="segoe line-height-1-05"><label for="">line height 1.05 Segoe UI</label></div>
    
    
  </body>

</html>