I'm in a situation where a pre-processor that I can't control is trying to help me and I'm trying to format something by using some clever CSS to work around it.
What I'm entering is:
<span class="foo">Some Text</span>
What it is generating is (remember, I have no control over this):
<p> <span class="foo">Some Text</span> </p>
Further complicating matters:
- the pre-processor has injected generic CSS of its own for the P tag after my own styles, forcing unwanted styling around my text, and
- this is actually desired behavior in other places (my span is the exception)
As such, I'm wanting to use a selector that selects P elements where my SPAN tag is inside. This is a plain style-sheet file, not jQuery where such things would be trivial.
In looking at http://www.w3.org/TR/CSS2/selector.html, it appears that E > F looks close, but it selects element F, not E.
I've got a hacked solution where I inject bogus elements with a class before my auto-wrapped spans, and then use the E.hack + F selector to grab the P element and fix the style, but adding an element just to do this feels wrong. I'm concerned I'm missing the obvious.
How would you select the P elements that have a particular span in them and not the span iteself?