Wie ein div in CSS Overlay

Question

Ich weiß möchten, wie this website der Lage war, diese

ich in CSS zu tun versucht Element zu finden, wie man über inspizieren, aber kein Glück gehabt. Kann jemand dies reproduzieren, ohne position: relative zu verwenden?

Ich war mit:

{ 
    position: relative; 
    top: -100px; 
} 

Answer 1

Der Schlüssel ist, einen negativen margin-top am unteren div zu verwenden.

.upper{ 
 
    width:100%; 
 
    height:100px; 
 
    margin:0; 
 
    padding:0; 
 
    background-color:green; 
 
} 
 
.lower{ 
 
    width:80%; 
 
    height:100px; 
 
    margin:0 auto; 
 
    padding:0; 
 
    background-color:red; 
 
    margin-top:-30px; 
 
}

<div class="upper"></div> 
 
<div class="lower"></div>