0

Is there a way using SASS to target an <li> if it contains a <ul>? I have this:

ul {
  li::before {
  content: "\2022";
  color: $color;
 }
}

with this html

<ul>
 <li> // problem li
  <ul>
   <li>stuff</li>
  </ul>
 </li>
</ul>

'<li> // problem li' is showing the bullet and I don't want it to.

I tried 

li {
  ul & {
   &:before {
   display: none;
  }
}

I'm not sure how to do this. I could apply a class to '<li> // problem li', but I'd like to keep it all in css if possible

Thank you

craigatcrow
  • 23
  • 3
  • Apply a class to the `li` and do it that way because currently there is no way to target a parent based on the child using css – Huangism Jan 18 '18 at 18:25
  • 1
    No, currently in CSS there's no way to target a node that's not the last one in your selector chain. `::before` also doesn't do what you think it does. – André Dion Jan 18 '18 at 18:25
  • With SASS you can do: `li { ul & ul &{ property: value; } }` – llobet Jan 19 '18 at 08:39

0 Answers0