Hide first x characters

Question

Is it possible to hide the first x character of a h4 element via css?

For example:

<h4>Data: This is some random data.</h4>

"Data: " shall not be shown.

I tried overflow and moving the div which contains h4, this works, but it isn't a good solution for me.

Maybe there's an command I don't know about which helps. I know JavaScript and strreplace would work as well, but I'm looking for a pure CSS solution.

Answer 1

Like others have said, it's not possible to exactly what you want. But just for fun, if it's always "Data: " that you're trying to hide, you could do this:

h4 {
    position: relative;
    background-color: white;
}

h4:before {
    content: "Data: ";
    position: absolute;
    top: 0;
    left: 0;
    background-color: white;
    color: white;
}

<h4>Data: This is some random data</h4>

But I agree with others, intercepting in the PHP is probably the best approach.