Removing & Replacing text elements

I have a couple of questions for you guys

When removing elements that are separated by a pipe | [or similar characters] how do I remove the pipe as well ?

And is there a straightforward way of replacing text by referencing the text itself ?



  • CSS deals exclusively with elements, so text can't be easily selected or changed. The best you could do is to hide the text by covering it with an element with the same background color as the page.
  • Are you talking about something like this?

    Links: x | y | z

    <p>Links: <span><a href="x.html">x</a> | <a href="y.html">y</a> | <a href="z.html">z</a></span></p>

    Here's a few ideas...although this would only work if the pipes (or other text) are "sectioned off" from other text that shouldn't be modified:

    Change font size to 0 and set other elements back to original size:
    span { font-size: 0; } span a:link { font-size: 16px; }

    or change the font color to the same as the background color, and then reset the color of the other elements:
    span { color: #fff; } span a:link { color: #00f; }

    or using Jason's idea of covering up with the same background color:
    span a:link { background-color: #fff; margin-left: -.4em; padding-left: .4em; }

    This is all assuming a default white background, black text and blue links.
  • thanks guys

    an inelegant solution but better than it was
Sign In or Register to comment.