0

I need a way to select this outer div which has three inner spans (div and span are just examples here):

<div>
 <span/>
 <span/>
 <span/>
</div>

The motivation is to select an element that has three of specified children. If it was just one, I could use div > span, if I just needed to select the spans (not the outer div), I could use span + span + span to select them.

Is something like div > (span + span + span) possible? (I've tried the parentheses but it's invalid)

UPDATE: Since when "an element containing a set of elements" become "selecting a parent"? This is not a duplicate, moreover, this is exactly the opposite of that question.

Can Poyrazoğlu
  • 33,241
  • 48
  • 191
  • 389
  • 1
    Unfortunately, this isn't possible – Jacob G May 10 '16 at 16:04
  • 1
    It's even not possible with a single child. `div > span` selects the span, not the div (See [Is there a CSS parent selector](http://stackoverflow.com/questions/1014861/is-there-a-css-parent-selector) and [Parent selectors in CSS](https://css-tricks.com/parent-selectors-in-css/)). – GolezTrol May 10 '16 at 16:06
  • try `div.i_have_3_spans` maybe? – zer00ne May 10 '16 at 16:06
  • class, id, data-*, etc... – zer00ne May 10 '16 at 16:08
  • 1
    An element that contains another element is that other element's parent. That's precisely what the word "parent" means. You're asking for a div that is a parent of three consecutive sibling spans, right? – BoltClock May 10 '16 at 16:10
  • @BoltClock thank you, but I know English, don't worry, I know what parent means. – Can Poyrazoğlu May 10 '16 at 16:12
  • 1
    @CanPoyrazoğlu You need to directly refer to the target, there is no way to make a selector solely based on an element being a parent. Using a class designated for certain divs that have 3 spans is your only recourse unless you use JavaScript. – zer00ne May 10 '16 at 16:18
  • 1
    Reviewing the close vote, "an element containing children E" is the same as "the parent element of E" for CSS purposes, which is the same as the other question. Sorry! – Jonathan Allard May 10 '16 at 23:56

1 Answers1

-3

if you want to select 3rd element within a parent then try this

div > span:nth-child(3)

if you want to select the div try javascript or jQuery

var d = $('div > span:nth-child(3)').closest('div');
d.css('attribute','value');

Another way is to put required style in css and assign class to that div using jquery.

Tahir Shahzad
  • 649
  • 7
  • 18
  • This doesn't answer the question. It's not about selecting the 3rd span, but about selecting a div, if it contains 3 spans. – GolezTrol May 10 '16 at 16:08