I am getting a list view of images instead displaying in grid format

I am new to Salesforce, I am unable to form a grid with images from the URLs that I have given in my apex class using JSON, they are returning a list view instead of resulting side by side.

Any help would be appreciated.

Component:

<aura:component implements="force:appHostable,flexipage:availableForAllPageTypes" controller="pic_ctrl">
    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
    <aura:attribute name="urls" type="String" />

    <!--  data: {!v.urls}  -->
    <aura:iteration items="{!v.urls}" var="row">
        <div class="slds-grid  slds-wrap"  style="height: 203px; width:400px ; background-color:white;" onclick="{!c.showcarousel}" >
            <div class="slds-col slds-size_1-of-2">
                <img src="{!row}"  style="height: 200px; width:400px ; background-color:white;"/>
            </div>
        </div>
    </aura:iteration>
</aura:component>

Controller.js:

({ 
    doInit : function(component, event, helper) {
        var getdata = component.get("c.geturl");
        var h = [];
        getdata.setCallback(this, function(response){      
            var state = response.getState();
            if (state === 'SUCCESS'){
                var Result = response.getReturnValue();
                console.log("enter" + Result);
                // console.log('1'+JSON.parse(result));
                //var finalJson = JSON.parse(finalJson1);
                var len=Result.length;
                console.log("final length" + Result.length);
                for(var i=0; i<len; i++){
                    console.log (Result[i]["imageURL"]); 
                    h.push(Result[i]["imageURL"]);
                }
                console.log("test-->"+h);
                component.set("v.urls",h);
                console.log("caught");
            }
        });
        $A.enqueueAction(getdata);      
}

Apex Class:

public class pic_ctrl {
    @AuraEnabled
    public static Object geturl() {
        String ImgJson = ' [        {"imageName": "Mice1.jpg","imageId": "101", "imageURL": "https://labpulse.s3.amazonaws.com/images/images1.jpg", "imageDescription": "Some description" },{"imageName": "Mice2.jpg","imageId": "101", "imageURL": "https://labpulse.s3.amazonaws.com/images/images2.jpg", "imageDescription": "Some description" },' +
   '{ "imageName": "Mice3.jpg","imageId": "102",  "imageURL": "https://labpulse.s3.amazonaws.com/images/images3.jpg", "imageDescription": "Some description" }, {"imageName": "Mice4.jpg", "imageId": "103", "imageURL": "https://labpulse.s3.amazonaws.com/images/images4.jpg",  "imageDescription": "Some description" }]';

        Object Finaljson= JSON.deserializeUntyped(ImgJson); 

        return Finaljson;
    } 
}