2

I have a div which has 2 children

<div class="parent">
    <div class="child1"> XYZ </div>
    <span class="child2">67</span>
</div>

if the child2 has text in it, I want child1 to be of 10px width but if child2 is an empty span, I want child1 to take 100% width. I tried using only-child but it is not working as anyway span is a child whether its empty or not.

Chandrika
  • 101
  • 1
  • 1
  • 9

1 Answers1

-2

use this

div.parent .child2 ~ .child1{width:10px};
div.parent .child2:empty ~ .child1{width:100%};
Mhd Wael Jazmati
  • 636
  • 9
  • 18
  • The element on the right side of the [general sibling combinator](https://developer.mozilla.org/en-US/docs/Web/CSS/General_sibling_combinator) (`~`) only matches those siblings that come *after* the element on the left side. – Ouroborus Dec 08 '21 at 09:55