# Styles for different view

**URL:** <https://forum.inductiveautomation.com/t/styles-for-different-view/106553>\
**Category:** Ignition\
**Tags:** perspective, ignition81\
**Created:** [May 22, 2025, 11:12am UTC](https://forum.inductiveautomation.com/t/styles-for-different-view/106553 "2025-05-22T11:12:05Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Kartik\_I](https://avatars.discourse-cdn.com/v4/letter/k/8c91f0/32.png) [@Kartik\_I](https://forum.inductiveautomation.com/u/Kartik_I)\
**Post date:** [May 22, 2025, 11:12am UTC](https://forum.inductiveautomation.com/t/styles-for-different-view/106553/1 "2025-05-22T11:12:05Z")

</div>

Hello,I am using perspective and I am trying to make my texts dynamic with media query. There are 2 types of devices(HMI, Desktop) and I want to scale them dynamic so can anyone help me out how I can do it.  
Thanks.

---

<div class="post-metadata">

**Author:** ![Alejandro\_Alaco](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/alejandro_alaco/32/59849_2.png) [@Alejandro\_Alaco](https://forum.inductiveautomation.com/u/Alejandro_Alaco)\
**Post date:** [May 22, 2025, 11:39am UTC](https://forum.inductiveautomation.com/t/styles-for-different-view/106553/2 "2025-05-22T11:39:11Z")

</div>

For responsive styling can use column container with column breakpoints

[Column Container Video at Inductive University](https://inductiveuniversity.com/videos/column-container/8.1)

or

[Perspective - Breakpoint Container | Ignition User Manual](https://www.docs.inductiveautomation.com/docs/8.1/appendix/components/perspective-components/perspective-container-palette/perspective-breakpoint-container)

---

<div class="post-metadata">

**Author:** ![pascal.fragnoud](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/pascal.fragnoud/32/24728_2.png) [@pascal.fragnoud](https://forum.inductiveautomation.com/u/pascal.fragnoud)\
**Post date:** [May 22, 2025, 1:12pm UTC](https://forum.inductiveautomation.com/t/styles-for-different-view/106553/3 "2025-05-22T13:12:49Z")

</div>

You can use the stylesheet to use media queries on a class.  
Then use that class on your labels.

---

<div class="post-metadata">

**Author:** ![nminchin](https://sea1.discourse-cdn.com/inductiveautomation/user_avatar/forum.inductiveautomation.com/nminchin/32/6911_2.png) [@nminchin](https://forum.inductiveautomation.com/u/nminchin)\
**Post date:** [May 22, 2025, 1:44pm UTC](https://forum.inductiveautomation.com/t/styles-for-different-view/106553/4 "2025-05-22T13:44:44Z")

</div>

> [@Useful CSS Stuff](https://forum.inductiveautomation.com/t/useful-css-stuff/95414/34):
>
> cough I've gone back to rem.. face_with_crossed_out_eyes But defined media queries in the stylesheet to change the root fontsize based on resolution.. fwiw, this is what I've been testing with, and it seems to be holding up ok... /\* Default root font size (applies to all screen sizes unless overridden) \*/ html { font-size: 16px; /\* Base size: 1rem = 16px \*/ } /\* For small screens (e.g., mobile phones). Note this is larger than the tablet size otherwise it's too small on mobile\*/ @media sc…

Checkout this post. I'd also suggest using rem units for all of your sizing as well like `gap`, margins, basis, etc

---

<div class="post-metadata">

**Author:** ![Kartik\_I](https://avatars.discourse-cdn.com/v4/letter/k/8c91f0/32.png) [@Kartik\_I](https://forum.inductiveautomation.com/u/Kartik_I)\
**Post date:** [May 23, 2025, 6:59am UTC](https://forum.inductiveautomation.com/t/styles-for-different-view/106553/5 "2025-05-23T06:59:16Z")

</div>

Thanks all.