# What CSS can I use to display container options next to each other regardless of the screen size?

**URL:** <https://community.glideapps.com/t/what-css-can-i-use-to-display-container-options-next-to-each-other-regardless-of-the-screen-size/75440>\
**Category:** Ask for Help\
**Tags:** custom-css\
**Created:** [August 5, 2024, 8:50pm UTC](https://community.glideapps.com/t/what-css-can-i-use-to-display-container-options-next-to-each-other-regardless-of-the-screen-size/75440 "2024-08-05T20:50:55Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Tom\_Down](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/tom_down/32/40418_2.png) [@Tom\_Down](https://community.glideapps.com/u/Tom_Down)\
**Post date:** [August 5, 2024, 8:50pm UTC](https://community.glideapps.com/t/what-css-can-i-use-to-display-container-options-next-to-each-other-regardless-of-the-screen-size/75440/1 "2024-08-05T20:50:55Z")

</div>

I’m attempting to switch to the newer form of app after only previously learning the classic app system. Previously I was able to use a rich text object to display images side by side using custom style css.

With the new system I can’t seem to find a way to show objects side by side when in the mobile view, they always show in a column. Is there some custom CSS I can use to do this? I am not very familiar with using html code or css so any help would be very much appreciated.

---

<div class="post-metadata">

**Author:** ![Eric\_Penn](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/eric_penn/32/73888_2.png) [@Eric\_Penn](https://community.glideapps.com/u/Eric_Penn)\
**Post date:** [August 5, 2024, 10:07pm UTC](https://community.glideapps.com/t/what-css-can-i-use-to-display-container-options-next-to-each-other-regardless-of-the-screen-size/75440/2 "2024-08-05T22:07:57Z")

</div>

In new apps the css goes under settings → appearance. You could give the rich text component a class name under options or directly in the html itself.

[![](https://us1.discourse-cdn.com/flex002/uploads/glideapps/original/3X/4/2/426a625414d519c5bef2503125ac739134b1c745.jpeg "Custom CSS for Pages (Business and Enterprise)") ](https://www.youtube.com/watch?v=yEJPYaxjXRo)

One way to keep a 2 column container in both desktop and mobile is to give a 2 column container the class name _grid_ under the options for the container.

Then under settings → appearance use this css

```auto
.grid .oneToOne {
  grid-template-columns: repeat(2, minmax(0px, 1fr));
}

```

Hat tips to @Himaladin. Look out for anything that guy posts about css he’s very good.

---

<div class="post-metadata">

**Author:** ![Tom\_Down](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/tom_down/32/40418_2.png) [@Tom\_Down](https://community.glideapps.com/u/Tom_Down)\
**Post date:** [August 6, 2024, 8:40am UTC](https://community.glideapps.com/t/what-css-can-i-use-to-display-container-options-next-to-each-other-regardless-of-the-screen-size/75440/3 "2024-08-06T08:40:53Z")

</div>

Thanks Eric!  
That’s the closest I have gotten so far 😃

Is this method limited to 2 columns only? Or is it possible to scale this up to work the same way with 3 or 4 columns?

---

<div class="post-metadata">

**Author:** ![Eric\_Penn](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/eric_penn/32/73888_2.png) [@Eric\_Penn](https://community.glideapps.com/u/Eric_Penn)\
**Post date:** [August 6, 2024, 4:56pm UTC](https://community.glideapps.com/t/what-css-can-i-use-to-display-container-options-next-to-each-other-regardless-of-the-screen-size/75440/4 "2024-08-06T16:56:54Z")

</div>

You’re welcome! For 3 or 4 columns you could adjust the repeat. I’m away from my computer right now but I think it should look like this.

```auto
.grid-container .threeColumns {
    grid-template-columns: repeat(3, minmax(0px, 1fr));
}

```

---

<div class="post-metadata">

**Author:** ![Tom\_Down](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/tom_down/32/40418_2.png) [@Tom\_Down](https://community.glideapps.com/u/Tom_Down)\
**Post date:** [August 6, 2024, 7:11pm UTC](https://community.glideapps.com/t/what-css-can-i-use-to-display-container-options-next-to-each-other-regardless-of-the-screen-size/75440/5 "2024-08-06T19:11:41Z")

</div>

perfect!  
Thanks again 😃

---

<div class="post-metadata">

**Author:** ![system](https://sea2.discourse-cdn.com/flex002/user_avatar/community.glideapps.com/system/32/53398_2.png) [@system](https://community.glideapps.com/u/system)\
**Post date:** [August 13, 2024, 7:11pm UTC](https://community.glideapps.com/t/what-css-can-i-use-to-display-container-options-next-to-each-other-regardless-of-the-screen-size/75440/6 "2024-08-13T19:11:43Z")

</div>

This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.