# V7, Breakpoints, media queries and the new tabs

**URL:** <https://forum.pinegrow.com/t/v7-breakpoints-media-queries-and-the-new-tabs/7687>\
**Category:** Styling (CSS)\
**Tags:** css\
**Created:** [January 24, 2023, 7:02am UTC](https://forum.pinegrow.com/t/v7-breakpoints-media-queries-and-the-new-tabs/7687 "2023-01-24T07:02:18Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![excede](https://avatars.discourse-cdn.com/v4/letter/e/8baadc/32.png) [@excede](https://forum.pinegrow.com/u/excede)\
**Post date:** [January 24, 2023, 7:02am UTC](https://forum.pinegrow.com/t/v7-breakpoints-media-queries-and-the-new-tabs/7687/1 "2023-01-24T07:02:18Z")

</div>

So I noticed in version 7 there’s some new tabs in the top right corner that are meant to work with breakpoints and media queries or rules but I’m not exactly sure how to utilise them. Is there any documentation on the new version and specifically working with media queries and breakpoints in pure css. I’m hoping these tabs make it a little easier.

 ![Screenshot 2023-01-24 at 5.57.11 pm](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/e/e57f214b207411609985d83e780e2ef3182ad1c5.png)

---

<div class="post-metadata">

**Author:** ![Emmanuel](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/emmanuel/32/6294_2.png) [@Emmanuel](https://forum.pinegrow.com/u/Emmanuel)\
**Post date:** [January 24, 2023, 8:33am UTC](https://forum.pinegrow.com/t/v7-breakpoints-media-queries-and-the-new-tabs/7687/2 "2023-01-24T08:33:02Z")

</div>

You can have a look at all the novelties from the Interactive tutorials included directly in Pinegrow

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/1/1b5b6400326ffa0e41b8bd24f226b2c2139415f3.jpeg)

 ![image](https://canada1.discourse-cdn.com/flex036/uploads/pinegrow/original/2X/5/5c1fa302a1c90021b4b38c75ea0af21673c2fc29.png)

---

<div class="post-metadata">

**Author:** ![excede](https://avatars.discourse-cdn.com/v4/letter/e/8baadc/32.png) [@excede](https://forum.pinegrow.com/u/excede)\
**Post date:** [January 24, 2023, 9:36am UTC](https://forum.pinegrow.com/t/v7-breakpoints-media-queries-and-the-new-tabs/7687/3 "2023-01-24T09:36:41Z")

</div>

Thanks @Emmanuel. Perhaps worthy of another post, I need to build a bunch of gatsby projects, is there any workflow you could suggest to make react components in pinegrow that you know of?

---

<div class="post-metadata">

**Author:** ![Emmanuel](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/emmanuel/32/6294_2.png) [@Emmanuel](https://forum.pinegrow.com/u/Emmanuel)\
**Post date:** [January 24, 2023, 11:00am UTC](https://forum.pinegrow.com/t/v7-breakpoints-media-queries-and-the-new-tabs/7687/4 "2023-01-24T11:00:39Z")

</div>


