Untitled fiddle

HTML

<div class="e">
  <p>
    Long line that wraps long line that wraps long line that wraps long line that wraps long line that wraps
  </p>
  <p>y</p>
  <p>z</p>
</div>

<div class="two">
  <p>
    Long line that wraps long line that wraps long line that wraps long line that wraps long line that wraps
  </p>
  <p>y</p>
  <p>z</p>
</div>

CSS

.e p {
  background: lime;
  width: fit-content;
}

.two p {
  background: orangered;
  display: inline;
}
.two p::after {
  content: "";
  display: block;
  margin: inherit;
}