I'm trying to display pictures in a special div. 
So now it looks like this : ![enter image description here](https://i.stack.imgur.com/Czd4w.jpg)

So as you can see the green divs are out of there parent div (black one)

It's built like this : 

```
<div class="photoView center">
    <div class="grid">
        <div ng-repeat="i in [1,2,3]" class="groupPhoto">
            <div ng-repeat="i in [1,2,3,4]" class="col-1-4 photoSimple" style="display:inline-block;"></div>
        </div>
    </div>
</div>

```

CSS : 

```
.photoPrincipal {
  width: 600px;
  height: 300px;
  background-color: blue;
}

.photoView {
  width: 600px;
  height: 300px;
  background-color: rgba(0, 0, 0, 1);
  margin-top: 50px;
}

.photoSimple {
  width: 130px;
  height:75px;
  background-color: green;
  margin:10px;
  border: 2px dotted white;
  display:block;
}

```

**EDIT**  

I fogot to mention that I use SimpleGrid, which is a "CSS library" which delivers css for grid. now it works with this : <http://jsfiddle.net/jmsqskyn/>

So basically I just want 4 green divs per line. But it continues.

I tried to apply a `display:block`but it doesn't change anything.