# Change view relative to screen size

**URL:** <https://forum.bubble.io/t/change-view-relative-to-screen-size/256761>\
**Category:** Mobile\
**Created:** [April 11, 2023, 8:25am UTC](https://forum.bubble.io/t/change-view-relative-to-screen-size/256761 "2023-04-11T08:25:56Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![graham1](https://avatars.discourse-cdn.com/v4/letter/g/8baadc/32.png) [@graham1](https://forum.bubble.io/u/graham1)\
**Post date:** [April 11, 2023, 8:25am UTC](https://forum.bubble.io/t/change-view-relative-to-screen-size/256761/1 "2023-04-11T08:25:56Z")

</div>

Hi, is it possible to display the width of a container differently depending on the page width of the device it is shown on?  
I’d like to show a group container holding a repeating group as 100% width on a mobile device and around 60% on a tablet or PC.  
All advice, deeply appreciated.

---

<div class="post-metadata">

**Author:** ![adamhholmes](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/adamhholmes/32/100510_2.png) [@adamhholmes](https://forum.bubble.io/u/adamhholmes)\
**Post date:** [April 14, 2023, 9:14am UTC](https://forum.bubble.io/t/change-view-relative-to-screen-size/256761/2 "2023-04-14T09:14:44Z")

</div>

Just put a condition on it to change the width based on the screen width.

---

<div class="post-metadata">

**Author:** ![r14n.z41](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/r14n.z41/32/139670_2.png) [@r14n.z41](https://forum.bubble.io/u/r14n.z41)\
**Post date:** [April 14, 2023, 11:54am UTC](https://forum.bubble.io/t/change-view-relative-to-screen-size/256761/3 "2023-04-14T11:54:23Z")

</div>

Hi @graham1

1. You can set a condition on each element, and this option can work with Responsive Tabs. It’s also important to understand the container types, such as Fixed, Column, Row, and Align to Parent.  
 ![image](https://us1.discourse-cdn.com/bubble/original/3X/7/1/71c7a63b8f0cfef75cd229363319c232c217b942.png)

2. you can use Device Detector Plugins to identify user device.

---

<div class="post-metadata">

**Author:** ![graham1](https://avatars.discourse-cdn.com/v4/letter/g/8baadc/32.png) [@graham1](https://forum.bubble.io/u/graham1)\
**Post date:** [April 14, 2023, 1:56pm UTC](https://forum.bubble.io/t/change-view-relative-to-screen-size/256761/4 "2023-04-14T13:56:22Z")

</div>

Thanks R14. I used a page load condition sending mobile users to a \_mobile clone with element widths specific to a mobile device. That works, but I will have a look at the device detector plugin, prior to launch.

---

<div class="post-metadata">

**Author:** ![r14n.z41](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/r14n.z41/32/139670_2.png) [@r14n.z41](https://forum.bubble.io/u/r14n.z41)\
**Post date:** [April 14, 2023, 10:23pm UTC](https://forum.bubble.io/t/change-view-relative-to-screen-size/256761/5 "2023-04-14T22:23:56Z")

</div>

Nice!