# Individual responsive behaviour

**URL:** <https://community.sitejet.io/t/individual-responsive-behaviour/200>\
**Category:** Website Builder\
**Tags:** cms\_presets, cms\_usability\
**Created:** [June 1, 2021, 10:03am UTC](https://community.sitejet.io/t/individual-responsive-behaviour/200 "2021-06-01T10:03:26Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Akki\_N](https://avatars.discourse-cdn.com/v4/letter/a/edb3f5/32.png) [@Akki\_N](https://community.sitejet.io/u/Akki_N)\
**Post date:** [June 1, 2021, 10:03am UTC](https://community.sitejet.io/t/individual-responsive-behaviour/200/1 "2021-06-01T10:03:26Z")

</div>

I want a 70/30 container to appear as 50/50 on mobile. Is there a simple way to do this without coding?

---

<div class="post-metadata">

**Author:** ![zachary](https://dub1.discourse-cdn.com/flex017/user_avatar/community.sitejet.io/zachary/32/26_2.png) [@zachary](https://community.sitejet.io/u/zachary)\
**Post date:** [June 1, 2021, 12:22pm UTC](https://community.sitejet.io/t/individual-responsive-behaviour/200/2 "2021-06-01T12:22:35Z")

</div>

Hi @Akki_N !

Super easy.

First, simply open up the preset style panel on the left with your 70/30 preset selected.

 ![Screen Shot 2021-06-01 at 8.13.33 AM](https://europe1.discourse-cdn.com/flex017/uploads/sitejet/original/1X/dd29a83c893a4e90c7faf442176a798815d85a64.png)

Then, simply select the Mobile Viewport in the toolbar at the top.

 ![Screen Shot 2021-06-01 at 8.13.33 AM](https://europe1.discourse-cdn.com/flex017/uploads/sitejet/original/1X/b7877a760d17ba0d724dde9689ee54a654a54bf0.png)

Then all you have to do is edit the “Width” in the preset style panel on the left. Any edits to presets will cascade down to smaller device sizes! Set it to 50%.

 ![Screen Shot 2021-06-01 at 8.14.12 AM](https://europe1.discourse-cdn.com/flex017/uploads/sitejet/original/1X/c4e4e467e30114dde56c5f490113ba56b977562d.png)

 ![Screen Shot 2021-06-01 at 8.14.12 AM](https://europe1.discourse-cdn.com/flex017/uploads/sitejet/original/1X/6146f7ebd05b0784b987c2967082494e1ea8fb9b.png)

 ![Screen Shot 2021-06-01 at 8.14.28 AM](https://europe1.discourse-cdn.com/flex017/uploads/sitejet/original/1X/e79b7087b756c7371deb776480866b195e89f1a4.png)

If you switch back to tablet or desktop viewports, you’ll see the 50% is no longer, and the previous values stayed the same.

Hope this helps!

---

<div class="post-metadata">

**Author:** ![Akki\_N](https://avatars.discourse-cdn.com/v4/letter/a/edb3f5/32.png) [@Akki\_N](https://community.sitejet.io/u/Akki_N)\
**Post date:** [June 1, 2021, 12:50pm UTC](https://community.sitejet.io/t/individual-responsive-behaviour/200/3 "2021-06-01T12:50:15Z")

</div>

Hi Zachary,  
Thank you very much, super easy, indeed!  
I tried it with a preset class. Not that successful!

---

<div class="post-metadata">

**Author:** ![Andre](https://dub1.discourse-cdn.com/flex017/user_avatar/community.sitejet.io/andre/32/3459_2.png) [@Andre](https://community.sitejet.io/u/Andre)\
**Post date:** [June 1, 2021, 1:01pm UTC](https://community.sitejet.io/t/individual-responsive-behaviour/200/4 "2021-06-01T13:01:29Z")

</div>

I should buy you a coffee and a nice cake soon, Zach. Tremendous explanation and solution!

---

<div class="post-metadata">

**Author:** ![Andre](https://dub1.discourse-cdn.com/flex017/user_avatar/community.sitejet.io/andre/32/3459_2.png) [@Andre](https://community.sitejet.io/u/Andre)\
**Post date:** [June 28, 2021, 2:33pm UTC](https://community.sitejet.io/t/individual-responsive-behaviour/200/5 "2021-06-28T14:33:25Z")

</div>


