CODEWITHSUNDEEP
htmlcss
user3386779
user3386779

Reputation: 7175

check the parent div has the div with child class

I want to check the parent div has the div given class.I have the parent div '.parent'.I want to check this parent have the div with class '.child' in css.Is it possible in css.I have acheived this using

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="parent">
  <div class="child">
     test
  </div>
</div>

jquery but I want to check it in css

Upvotes: 0

Views: 3009

Answers (3)

Asav Vora
Asav Vora

Reputation: 61

.parent .child
{
   /*Your style under child div*/
}

.parent
{
   // Style under all matched with parent
}

you can try like this. Eventually it apply only when child class is found.

Upvotes: 0

frnt
frnt

Reputation: 8795

Yes that's possible to check using CSS :empty selector as below,

The :empty pseudo-class represents any element that has no children at all.

If it has any child element or text node then background style remains blue else if it's empty then background style changes to red. 

.parent{
  background:blue;
  width:100%;
  height:50px;
  margin-bottom:10px;
}
.parent:empty{
  background:red;
}
<div class="parent"></div>
<div class="parent">
  <div class="child">
     test
  </div>
</div>

Upvotes: 2

QA Gaurav
QA Gaurav

Reputation: 21

try this one for more details

https://developer.mozilla.org/en-US/docs/Web/CSS/:has

.parent:has('.child')
{
properties
}

Upvotes: 2

Related Questions