Tree Hover Styling

by maxm007

HTML

<div class="tree-item">
   <div class="tree-item-content">
      Parent
   </div>
   <div class="tree-item-children">
    <div class="tree-item">
       <div class="tree-item-content">
          Child 1
       </div>
       <div class="tree-item-children">
          <div class="tree-item">
           <div class="tree-item-content">
             Grandchild
           </div>
           <div class="tree-item-children">
           </div>
      </div>   
       </div>
    </div>      
    <div class="tree-item">
       <div class="tree-item-content">
          Child 2
       </div>
       <div class="tree-item-children">
       </div>
    </div>      
   
      
   </div>
</div>

CSS

.tree-item-children{
  padding-left:25px
}

.tree-item-content:hover{
  background:yellow
}