CSS: How would I select a specific Text and hide it

Question

I don't have access to html, but i want to test something... How would I select the text boomboomboom and hide it with CSS...

the markup looks like this:

<div class="bla">
  <div>
    <strong>some text</strong>
    <br />
    boomboomboom
  </div>
</div>

I tryed this:

.bla div {
  text-indent: -9999px;
}
.bla div strong {
  text-indent: 0px;
}

but this just hides "some text" instead of "boomboomboom"...

can anyone help me? http://jsfiddle.net/b26N7/1/

I dont think this is possible with css only.. you can use javascript to do it, css is based on elements, id, class not text — Raunak Kathuria, Jan 09 '14 at 09:20

score 3 · Accepted Answer · edited May 23 '17 at 10:33

3

Check this topic, it's the same thing.

Conclusion is, you can't select the text node with the css at this moment(without wraping it in a html element), but you can do it with JavaScript.

edited May 23 '17 at 10:33

Community

1
1

answered Jan 09 '14 at 09:26

n1kkou

3,096
2
21
32

score -1 · Answer 2 · edited Jan 09 '14 at 09:30

-1

Remove <br /> to separate the "boomboomboom" in next line.
You can use "display:block" to show the "boomboomboom" in next line.

Then your css will work properly.

Example: http://jsfiddle.net/uL9Rg/

edited Jan 09 '14 at 09:30

S.L. Barth is on codidact.com

8,198
71
51
66

answered Jan 09 '14 at 09:25

Rakesh Kumar

2,705
1
19
33

He wanted to hide only the unwraped text node inside his div, not all the content – n1kkou Jan 09 '14 at 09:30

CSS: How would I select a specific Text and hide it

2 Answers2