JSFiddle - React, Tailwind, and code Playground

HTML

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  </head>
    
  <body>       
    <h1>Quote with Source</h1><br>
      <blockquote class="bq1" cite="http://www.hongkiat.com/blog/top-css-editors-reviewed/">
        <p>Every glorious revolution has its dark side, as for CSS is every web browser like IE7 does not support the same effect defined by CSS, so often designer has to squeeze their mind to figure out a trick, hack or fix, that’s when CSS Editor comes in to help.</p>
      </blockquote>
      <p class="after">- <a href="http://www.hongkiat.com/blog/top-css-editors-reviewed/">11 Top CSS Editors - Reviewed</a></p>
<br>
</body>
</html>

CSS

body { padding: 11px 15px; font-family: Arial, Tahoma, sans-serif; font-size: 12px; color: #454545; line-height: 14px; }

/** blockquote styles **/
      .bq1 { padding-left: 16px; border-left: 5px solid #577da4; width: 700px; }
      .bq1 p { font-style: italic; font-size: 14px; line-height: 18px; color: #8c8785; }
      p.after { margin-left: 40px; font-weight: bold; }
      p.after a:hover { text-decoration: underline; }