Korzystanie DIV zamaskować innego div

Question

to pytanie jest najlepiej wytłumaczyć o zrzucie: http://i42.tinypic.com/2ccvx91.jpg

Owijka div ma obraz tła w mieście.

#wrapper { 
    background:url('city.jpg'); 
} 

Wewnątrz tego div jest kilka innych div klasy „kwadrat”:

.square { 
    width:40px; 
    height:40px; 
    background-color:#27272f; 
    opacity:.8; 
    margin:2px; 
} 

Można przejrzeć kwadratów do miasta z powodu nieprzejrzystości. Ale możesz też przejrzeć spacje pomiędzy kwadratami, których nie chcę. Chcę tylko widzieć divy do elementu za nim, a przestrzenie między nimi są solidnie czarne. Jak mogę to zrobić?

Dzięki.

Answer 1

najlepiej jest usunąć margines .. i dać div granicę 2 px ..

Answer 2

A co z ustawianiem border i użyciem opakowania div, aby ukryć rogi. Trzeba mieć ujemny margines nakładanie pracować chociaż

Here is the adapted jsfiddle from animuson:

<div id="wrapper"> 
    <div class="hidingborder"> 
     <div class="square"></div> 
    </div> 
    <div class="hidingborder"> 
     <div class="square"></div> 
    </div> 
    <div class="hidingborder"> 
     <div class="square"></div> 
    </div> 
    <div class="hidingborder"> 
     <div class="square"></div> 
    </div> 
    <div class="hidingborder"> 
     <div class="square"></div> 
    </div> 
</div>​ 

i tutaj jest css

#wrapper { 
    background:Green; 
    font-size:0; 
} 
.square { 
    width:40px; 
    height:40px; 
    background-color:#27272f; 
    opacity:.8; 
    border:2px solid black; 
    border-radius:5px; 
    display:inline-block; 
    margin:-2px; 
} 
.hidingborder 
{ 
    border:#27272f solid; 
    display:inline-block; 
} 
​