Question

HTML:

<div id="a">A</div>
<div id="b">B</div>

CSS:

#a {
    float: left;

    width: 30px;
    height: 30px;
    color: white;
    background-color: red;
    border: 1px solid black;
    text-align: center;
}

#b {
    margin-left: 25px;

    width: 30px;
    height: 40px;
    color: white;
    background-color: green;
    border: 1px solid black;
    text-align: center;
}

See my code here: http://jsfiddle.net/mxtdg/;

It seems A is above B, what can I do if I want B to be above A?

Answer 1

Simply use position:relative and z-index:10 on #b, that will do the trick.

Demo: jsfiddle.net/Marcel/mxtdg/7/