JSFiddle - React, Tailwind, and code Playground

HTML

<div class="post-list">
  <div class="post-item">
    <img src="https://www.thomann.de/blog/wp-content/uploads/2017/01/mastering-blog.png"/>  
    
    <div class="post-content">
      <div class="post-content-header">
        <div class="titled text-wrap">
          <div class="title">
            <div class="topshadow">
              <span>Kremlin Tells Media to Cut Back on Fawning Trump Coverage, Sources Say</span>
            </div>

            <span class="line-highlight">
              Kremlin Tells Media to Cut Back on Fawning Trump Coverage, Sources Say
            </span>
          </div>
        </div>
        <div class="post-content-author">
          <div class="text-wrap">
            <img src="https://upload.wikimedia.org/wikipedia/commons/b/b0/Fender_logo.png"/>
            Franziska am 17. September 2016
          </div>        
        </div>
        <div class="post-content-text">
          <div class="text-wrap">
            Rikabd bringt die genialen Sounds von
            damals zum kleinen Preis in die Gegenwart
          </div>        
        </div>
      </div>
    </div>
  </div>



  <div class="post-item">
    <img src="https://www.thomann.de/blog/wp-content/uploads/2017/01/mastering-blog.png"/>  
    
    <div class="post-content">
      <div class="post-content-header">
        <div class="titled text-wrap">
          <div class="title">
            <div class="topshadow">
              <span>Kremlin Tells Media to Cut</span>
            </div>

            <span class="line-highlight">
              Kremlin Tells Media to Cut
            </span>
          </div>
        </div>
        <div class="post-content-author">
          <div class="text-wrap">
            <img src="https://upload.wikimedia.org/wikipedia/commons/b/b0/Fender_logo.png"/>
            Franziska am 17. September 2016
          </div>        
        </div>
        <div class="post-content-text">
          <div class="text-wrap">
            Rikabd bringt die...

SCSS

body {
  text-align: center;
  margin: 0;
  padding: 0;
  background: lightgrey;
  font-family: Arial, Verdana, sans-serif;
}

.post-list {
  max-width: 600px;
  margin: auto;
  padding: 0 10px;
  box-sizing: border-box;
  background: #dcdcdc;
  
  .post-item {
    margin-bottom: 40px;
    width: 100%;
    min-width: 300px;
    
    .post-content {
      text-align: left;
      width: 100%;
      margin-top: -40px;
      z-index: 1;
      margin-left: 20px;
      width: calc(100% - 20px);
      
      .text-wrap {
          display: inline;
          background: #fff;
          box-shadow: 8px 0 0 #fff, -8px 0 0 #fff;
          line-height: 1em;
          position: relative;         
      }
    
      &-header {
        padding-right: 5%;

        .titled {
          text-transform: uppercase;
          font-size: 1.8em;
          letter-spacing: -1px;
          line-height: 1em;
          position: relative;
        }
        
        .title {
          position: relative;
          margin: 0;
          padding: 0;
          line-height: 1.25em;
        }
      }
      
      &-text {
        padding-right: 30%;
        padding-right: 30%;
        margin-top: 8px;
        
        .text-wrap {
          padding: 10px 0;
          line-height: 1.7em;
        }
      }
      
      &-author {
        color: grey;
        font-size: 0.9em;
        margin-top: -3px;
        
        .text-wrap {
          padding: 10px 0;
          line-height: 2em;
        }
        
        img {
          width: 50px;
          height: 25px;
          position: relative;
          top: 8px;
          margin-right: 5px;
        }
      }
    }
  
    img {
      width: 100%;
      height: auto;
    }
  }
}

/*STEFAN h1 */
.topshadow {
  position: absolute;
    z-index: 1;
    top: -6px;
    height: 10px;
    margin-left: -8px;
    margin-right: -8px;
    padding: 0 8px;
    overflow: hidden;
}

.topshadow span {
    user-select:none;
    background-color: lightblue;
    color: ...