Angular Tree Management does not select the whole cell

Question

I tried to implement angular tree control from http://wix.imtqy.com/angular-tree-control , however I cannot select the whole cell, it only underlines the label, I tried changing the css that treecontrol is associated with, but still I I can not select its entire cell.

The current and expected result is here:

treecontrol { font-family: Verdana, Helvetica, Arial, sans-serif; font-size:13px; color: #555; text-decoration: none; } treecontrol ul { margin: 0; padding: 0; list-style: none; border: none; overflow: hidden; } treecontrol li { position: relative; padding: 0 0 0 20px; line-height: 20px; ul { padding-left: 16px; } .tree-label { cursor: pointer; display: inline; &:focus { outline: none; } &:hover { outline: none; background-color: yellow; } } .tree-selected { background-color: yellow; } &.tree-expanded { > div { > .tree-icon-expand { display: none; } > .tree-icon-collapse { display: inline; } } } } treecontrol li.tree-expanded i.tree-leaf-head, treecontrol li.tree-collapsed i.tree-leaf-head {display:none;} treecontrol li.tree-expanded i.tree-branch-head, treecontrol li.tree-collapsed i.tree-branch-head {display:inline;} treecontrol li.tree-leaf i.tree-branch-head {display:none;} treecontrol li.tree-leaf i.tree-leaf-head {display:inline;} treecontrol li i.tree-branch-head { cursor: pointer; } treecontrol li.tree-expanded i.tree-branch-head { padding: 1px 10px; background: url("../images/node-opened-light.png") no-repeat; } treecontrol li.tree-collapsed i.tree-branch-head { padding: 1px 10px; background: url("../images/node-closed-light.png") no-repeat; } treecontrol li.tree-leaf i.tree-leaf-head { padding: 1px 10px; width: 16px; height: 16px; background: none no-repeat; } 

Answer 1

You have an example on the same page you linked to

custom css classes

Your javascript will be

  function CustomCss($scope) { $scope.treedata=createSubTree(3, 4, ""); $scope.opts = { injectClasses: { "liSelected": "c-liSelected", } }; } 

And your CSS

 .c-liSelected {background-color: yellow}