DasSaffe
DasSaffe

Reputation: 2198

CSS Substring display none

Is it possible in CSS (only) to hide some text of a string? I know there these attribute-selectores like:

[att^=val] – the “begins with” selector

But for instance, having this:

<div class="some_random_text">
    This is a default text
</div>

I want to (display: none) only a certain substring - in thise case "default". I know how to do it with JS, but I'm looking for a CSS-solution only (if there is any).

Even though I guess it isn't possible to manipulate the DOM via CSS, which would be neccessary to have something like:

this is a <span class="hideThis">default</span> text

why would you need this and where does it occur?

For instance in a CMS (in my case OXID). You can add a title to a specific payment-method. Here I have

I want to have only PayPal visible in the frontend. The other PayPal-Paymenttypes have to remain however. Naming them all PayPal just leads to confusion.

there is the content-property. Is it somehow managable with that?

Again, no JS :-)

Upvotes: 0

Views: 309

Answers (3)

fnune
fnune

Reputation: 5534

It's not possible, here's the documentation on selectors: https://www.w3.org/TR/css3-selectors/#selectors

Upvotes: 0

Derlin
Derlin

Reputation: 9881

It it not possible. The only thing that can actually modify the inside text is the content property. Assuming something changes in your dom, you can have rules like:

.some_random_text:after {
  content: "This is a text";
}

other_select .some_random_text:after {
    content: "This is a default text";
}

But sincerely, I don't get the point, as JS and consors are made for that.

Upvotes: 1

Matthew Lymer
Matthew Lymer

Reputation: 977

To answer your question - no, it's not possible using only CSS.

You can;

  • Edit the HTML as you suggested

this is a <.span class="hideThis">default<.span > text

  • Use JS to alter the elements innerHTML value
  • Use a pre-processing language (like PHP or ASP, whatever you are able to use) to reduce the string to a substring.

Sorry if that's not the answer you wanted, but those are your options.

Upvotes: 2

Related Questions