css用hover，为何子元素 显示背景色，而不是当前元素显示呢？

Question

        <div ng-repeat="xx in [1,2,3,4,5,6]">
                <div class="col-sm-12 leftMenuItem">
                    <span style="font-size: 20px;padding: 10px;line-height: 32px;">报444生成</span>
                </div>
            </div>

css:

.leftMenuItem{
        background: rgba(255, 131, 5, 0.58);
        height: 35px;
        border-bottom: solid 1px #58565652;
    }

    .leftMenuItem :hover{
        background: rgb(255, 136, 31);
        cursor: pointer;
        height: 35px;
        border-bottom: solid 1px #58565652;
    }

效果：

这是 设置了 span的背景色啊。而不是 li的 背景色？如何让 子集不要这样子呢？

Answer 1

因为你冒号前面多了一个空格