2013-05-04 11 views
5

Ich habe zwei div gefälltwie zwei div in css zu überlappen?

<div class="imageDiv"></div> 
<div class="imageDiv"></div> 

und css Klasse,

.imageDiv 
    { 
     margin-left: 100px; 
     background: #fff; 
     display: block; 
     width: 345px; 
     height: 220px; 
     padding: 10px; 
     border-radius: 2px 2px 2px 2px; 
     -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; 
     -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; 
     box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset; 
    } 

Sie das Ergebnis Here :)

sehen kann ich diese zwei div mag überlappen wollen,

enter image description here

+0

Sie benötigen sie verschiedene Klassennamen zu geben und ein bewegen. vielleicht mit position relativ oder css3 translate – btevfik

+0

Mögliche duplicate: ** [CSS: Machen Sie zwei sich überlagernde Elemente überlappen] (http://stackoverflow.com/questions/9227007/css-make-two-floating-elements-overlap) ** –

+0

ja, muss zwei Klassen als '(.imgDivOne, .imgDivTwo)' :) Können Sie mir ein Beispiel zeigen? – zey

Antwort

13

Zum zweiten div bottomDiv

hinzufügen und dies zu css hinzufügen.

.bottomDiv{ 
     position:relative; 
     bottom:150px; 
     left:150px; 
    } 

http://jsfiddle.net/aw8RD/1/

+2

+1, danke, nützlich! – zey

2

See demo here benötigen Sie einen additiona calss für die zweite div Sie

.overlap{ 
    top: -30px; 
position: relative; 
left: 30px; 
} 
+0

+1, ich bearbeitet likes> 'top: -100px; position: relative; links: 150px;' – zey

0

I edited vorstellen fiddle Sie müssen nur z-index an das Frontelement hinzufügen und positionieren Sie es entsprechend .

0

Kontrolle dieses fiddle, und wenn Sie die überlappten div Sie seine Position dann auf absolute gesetzt verschieben möchten ändern, es ist top und left Werte

Verwandte Themen