Just started using sass, wondering why I didn’t do this earlier. Started a new project just to try it out and see what all the fuzz was about.
Almost right away I ran into a problem though not one I was expecting. I have an unordered list on which I have used
li:empty {display: none;}
to hide empty list elements, I like to make room for more stuff before I need it. Problem is that for some reason it uses the styling for regular list elements instead, which is
li {display: inline-block;}
Now sure I can just remove the empty divs in this case but I still want to figure out what I’ve missed.
What makes it all even more curious is that when I reproduced the code in codepen it worked flawlessly. Here is the codepen.
Any insight would be appreciated. It’s getting late so it just might be tired eyes.