# Is there any option to make photo collage inside glide

**URL:** <https://community.glideapps.com/t/is-there-any-option-to-make-photo-collage-inside-glide/35617>\
**Category:** Ask for Help\
**Created:** [December 7, 2021, 9:04am UTC](https://community.glideapps.com/t/is-there-any-option-to-make-photo-collage-inside-glide/35617 "2021-12-07T09:04:48Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![Manikandan\_R](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/manikandan_r/32/43482_2.png) [@Manikandan\_R](https://community.glideapps.com/u/Manikandan_R)\
**Post date:** [December 7, 2021, 9:04am UTC](https://community.glideapps.com/t/is-there-any-option-to-make-photo-collage-inside-glide/35617/1 "2021-12-07T09:04:48Z")

</div>

Photo collage inside the glide app.is it possible? May be use of css?

---

<div class="post-metadata">

**Author:** ![ShantanuIyengar](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/shantanuiyengar/32/35546_2.png) [@ShantanuIyengar](https://community.glideapps.com/u/ShantanuIyengar)\
**Post date:** [December 7, 2021, 12:20pm UTC](https://community.glideapps.com/t/is-there-any-option-to-make-photo-collage-inside-glide/35617/2 "2021-12-07T12:20:36Z")

</div>

![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/7/9/79038d5dbc72b878a35f5aca9b906ddee33cb105.jpeg)

All odd elements would be having this code

> div[id\*=‘screenScrollView’] \> div \> :nth-child(1) \> div \> div {  
> width : 50%;  
> height : 50%;  
> background : transparent;  
> margin-left : 0.3px  
> }

All even elements would be

> div[id\*=‘screenScrollView’] \> div \> :nth-child(2) \> div {  
> width : 50%;  
> height : 50%;  
> margin-top:-187.5px;  
> margin-left: 187.5px  
> }

So my details view has 4 images  
the code for the same is:

> `<pre><span><style>`  
> div[id\*=‘screenScrollView’] \> div \> :nth-child(1) \> div \> div {  
> width : 50%;  
> height : 50%;  
> background : transparent;  
> margin-left : 0.3px  
> }  
> div[id\*=‘screenScrollView’] \> div \> :nth-child(2) \> div {  
> width : 50%;  
> height : 50%;  
> margin-top:-187.5px;  
> margin-left: 187.5px  
> }  
> div[id\*=‘screenScrollView’] \> div \> :nth-child(3) \> div \> div {  
> width : 50%;  
> align: end;  
> margin-left : 0.3px  
> }  
> div[id\*=‘screenScrollView’] \> div \> :nth-child(4) \> div {  
> width : 50%;  
> margin-top:-187.5px;  
> margin-left: 187.5px  
> }

---

<div class="post-metadata">

**Author:** ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)\
**Post date:** [December 7, 2021, 12:47pm UTC](https://community.glideapps.com/t/is-there-any-option-to-make-photo-collage-inside-glide/35617/3 "2021-12-07T12:47:27Z")

</div>

Does this work the same way in desktop view? Good work.

---

<div class="post-metadata">

**Author:** ![ShantanuIyengar](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/shantanuiyengar/32/35546_2.png) [@ShantanuIyengar](https://community.glideapps.com/u/ShantanuIyengar)\
**Post date:** [December 7, 2021, 12:52pm UTC](https://community.glideapps.com/t/is-there-any-option-to-make-photo-collage-inside-glide/35617/4 "2021-12-07T12:52:51Z")

</div>

Not really! The margin-left and margin-top are different on a bigger screen!  
All about finding a sweet spot!

---

<div class="post-metadata">

**Author:** ![Himaladin](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/himaladin/32/71023_2.png) [@Himaladin](https://community.glideapps.com/u/Himaladin)\
**Post date:** [December 7, 2021, 1:06pm UTC](https://community.glideapps.com/t/is-there-any-option-to-make-photo-collage-inside-glide/35617/5 "2021-12-07T13:06:39Z")

</div>

I have tried your CSS inside GDE and it doesn’t work.  
You might try the one below. This CSS may work for any size of the screen.

```auto
<pre><span><style>
div[id*='screenScrollView'] > div > :nth-of-type(1) {
width : 50%;
height : 50%;
background : transparent;
margin-left : 0%
}
div[id*='screenScrollView'] > div > :nth-of-type(2){
width : 50%;
height : 50%;
margin-top:-50%;
margin-left: 50%
}
div[id*='screenScrollView'] > div > :nth-of-type(3){
width : 50%;
margin-left : 0%
}
div[id*='screenScrollView'] > div > :nth-of-type(4){
width : 50%;
margin-top:-50%;
margin-left: 50%
}

```

---

<div class="post-metadata">

**Author:** ![ThinhDinh](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/thinhdinh/32/49_2.png) [@ThinhDinh](https://community.glideapps.com/u/ThinhDinh)\
**Post date:** [December 7, 2021, 1:33pm UTC](https://community.glideapps.com/t/is-there-any-option-to-make-photo-collage-inside-glide/35617/6 "2021-12-07T13:33:02Z")

</div>

![image](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/b/e/be94037948974534d704d348d3fc434ad000ea5e.jpeg)

Why don’t we do it with an inline list?

---

<div class="post-metadata">

**Author:** ![Himaladin](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/himaladin/32/71023_2.png) [@Himaladin](https://community.glideapps.com/u/Himaladin)\
**Post date:** [December 7, 2021, 3:19pm UTC](https://community.glideapps.com/t/is-there-any-option-to-make-photo-collage-inside-glide/35617/7 "2021-12-07T15:19:45Z")

</div>

How about this? 😅

 ![Screenshot 2021-12-07 221709](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/c/b/cb075d32029241599c28f78273ad37bc5e966ea9.jpeg)