Preview doesn't work correct for List control with inner elements with css style

Bug Reports
#1

This work fine in browser but doesn't work in bootstrap studio preview.

     <ul>
        <li><a href="#">Link</a></li>
        <li>Item 2</li>
        <li>Item 3</li>
        <li>Item 4</li>
    </ul>

<style> li > a{ color:red; } </style>
#2

I think the reasoning is that it's not a correct way to code it since you shouldn't have links embed within each other (li a a{color:red}) so you wouldn't declare li > a{color:red}.

It should be coded as li a{color:red} and if you have another link in say a span then you'd need to specify that independently li span a{color:black}.

< ul>
    < li>
        < a hre="#">1< /a>) correct
    < /li>
    < li>
        < a hre="#">1< a hre="#">.1)< /a>< /a>) incorrect
    < /li>
    < li>
        < a hre="#">1< /a>< span>< a hre="#">.2< /a>< /span>) correct
    < /li>
< /ul>

The CSS

li a{
    color:red;
}

li span a{
    color:black;
}

The browsers all like to fix mistakes and broken coding and at times rewrite the code to be standards formatting such that you can write a table without tbody but your browser will render it with that if you use the inspect tool.

I hope that helps to understand how or why it's working the way it does.

Saj