How to overlap multiple divs?

Question

I have 3 divs in a row and then again 3 divs in another row like a grid.

I want to overlap div#4 on div#1,

Please provide a reproducible HTML and CSS example to show us what you have tried so far. — Hidden Hobbes, Feb 21 '17 at 12:29
Possible duplicate of [How to overlay one div over another div](http://stackoverflow.com/questions/2941189/how-to-overlay-one-div-over-another-div) — Hidayt Rahman, Feb 21 '17 at 12:50

Sumit Sinha · Answer 1 · 2017-02-22T04:48:14.997

0

You can try with one div having position absolute and other with position relative.

<div class="gray">

    <div class="blue">


    </div>
</div> 
.gray {
    background-color: #818181;

    height: 220px;
    width: 300px;
    position: absolute;
    overflow: hidden;
}

.blue {
    background-color: #0090ff;
    top: 0;
    height: 200px;
    width: 180px;

    position: relative;
    float:left;
    margin-left: 30px;
    margin-top: 10px;
}

edited Feb 22 '17 at 04:48

answered Feb 21 '17 at 12:43

Sumit Sinha

189
1
2
12

1

To what point? Which value should be applied to which div? They're numbered, what div should be absolute and which should be relative? What position to give the parent? – dakab Feb 21 '17 at 13:11

How to overlap multiple divs?

1 Answers1