I have a minimal example here: <https://codepen.io/cpcpcpcpcpx/pen/VwZWoyJ>

Containing the following:

```css
.wrapper {
  width: 200px;
}

h1 {
  font-size: 32px;
  font-family: Tahoma, Helvetica, sans-serif;
  line-height: 50px;
}

.header-text {
  background: #aabbcc;
  padding-left: 20px;
  padding-right: 20px;
  border-radius: 6px;
}
```

```html
<div class='wrapper'>
  <h1>
    <span class='header-text'>
           Long text that wraps
         </span>
  </h1>
</div>
```

The horizontal padding only applies to the very beginning and end of the text where it wraps, but I want it to apply on every line. I'm OK with the border-radius not being at the line-break points of every line, but I need the padding to apply.

If I put padding-top into the .header-text class that applies to both lines, so I'm unclear why the points where lines wrap ignore the horizontal padding options.

Is there a way to do this in CSS?