在另一个CSS上重叠一个div

Question

如何重叠蓝条上的黄色条在这里：

    .progressBar #bar1 {
        height: 100%;
        color: #fff;
        float: left;
        text-align: right;
        line-height: 22px; 
        width: 0;
        background-color: #0099ff;

    }
    .progressBar #bar2 {

        height: 100%;
        color: #fff;
        text-align: right;
        line-height: 22px; 
        width: 0;
        background-color: yellow;
        z-index:10;               

    }

http://jsfiddle.net/web_developer_888/CtH9k/3143/

Answer 1

您需要向float: left;和#bar1选择器添加#bar2 CSS属性。查看更新的jsFiddle

Answer 2

您可以使用职位http://jsfiddle.net/has3jcbp/

来完成

.progressBar {
                width: 400px;
                height: 22px;
                border: 1px solid #111;
                background-color: #292929;
                position: relative;
            }
            .progressBar #bar1 {
                height: 100%;
                color: #fff;
                float: left;
                text-align: right;
                line-height: 22px;
                width: 0;
                background-color: #0099ff;
                position: absolute;
                top:0;
                left:0;
            }
            .progressBar #bar2 {
                position: absolute;
                top:0;
                left:0;
                height: 100%;
                color: #fff;
                text-align: right;
                line-height: 22px;
                width: 0;
                background-color: yellow;
                z-index:10;
            }