0

I know that text-decoration-skip can be used to make descendant elements turn off their parent's text decorations such as underlining, line-through, and overline, but is there a comparable way to turn off borders in a descendant element?

Example HTML:

<p class="border">This text has a border 
    <span class="no_border">and this text doesn't</span></p>

Example CSS:

.border {
border: 1px solid #FF0000;
}

.no_border {
    /* magic border turn off trickery */
}

I would appreciate any method you know of for doing this as I think it would be a very nice effect, but I'm starting to think it may be impossible base on this question: CSS text-decoration property cannot be overridden by child element.

Someone asked why not just add another span element. While That is probably the best solution, and I should probably just start doing it, the reason why I hesitate is because my text is being generated with things like this:

$('<p/>', { "id" : "seq_insert_" + i, "class" : arraySeqArrays[i].getBaseType() + " " + arraySeqArrays[i].getFivePrime(), "text" : subsequence } ).add($('<p/>', { "id" : "comp_insert_" + i, "class" : arraySeqArrays[i].getBaseType() + " " + arraySeqArrays[i].getThreePrime(), "text" : subcomplement } )).wrapAll('<td/>').parent().appendTo('#' + subsequenceId);

So I can probably figure out a way to add another span to that, but might take me awhile heh.

Community
  • 1
  • 1
sage88
  • 4,104
  • 4
  • 31
  • 41
  • Instead of adding a border and then removing it, why not add a span that adds a border to the first bit of text? – bookcasey Apr 27 '13 at 13:45
  • That is probably the easiest way to do this, wish I had thought of it before I wrote out all my jQuery javascript... Added how the text is being generated above. – sage88 Apr 27 '13 at 14:02

1 Answers1

0

No, but you could match the border to the background color for a similar effect:

Demo

.no_border {
    border: 1px solid white;
}
bookcasey
  • 39,223
  • 13
  • 77
  • 94
  • That doesn't work well, though it was something I tried. It sometimes covers the other border, but often it pokes out. Additionally it will not leave a complete outline which is the desired effect. – sage88 Apr 27 '13 at 14:08