# Symbol Styles Ignoring Custom Breakpoints in Widgets

**URL:** <https://forum.builder.io/t/symbol-styles-ignoring-custom-breakpoints-in-widgets/13460>\
**Category:** Bugs\
**Tags:** react, nextjs\
**Created:** [March 18, 2025, 9:10am UTC](https://forum.builder.io/t/symbol-styles-ignoring-custom-breakpoints-in-widgets/13460 "2025-03-18T09:10:17Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![Gaurav-spr](https://avatars.discourse-cdn.com/v4/letter/g/a87d85/32.png) [@Gaurav-spr](https://forum.builder.io/u/Gaurav-spr)\
**Post date:** [March 18, 2025, 9:10am UTC](https://forum.builder.io/t/symbol-styles-ignoring-custom-breakpoints-in-widgets/13460/1 "2025-03-18T09:10:17Z")

</div>

I am experiencing an issue related to the recent introduction of support for a fourth breakpoint in [Builder.io](http://Builder.io). While using Symbols to create custom components, I have observed that the responsive styles set through custom breakpoints function correctly within the Symbols pages. However, when these Symbols are utilized within a widget entry, they do not adhere to the custom breakpoints. Instead, styles are applied based on the default breakpoints, leading to visually incorrect outputs.

**Details for Debugging:**

- **Space Name:** Vishvesh S Space
- **Space Public API Key:** 04a0ecade74f48f4b8534e7a16969739
- **Symbol ID:** 06ab0e014b7643b0a41357b37a02ded7
- **Entry ID Using the Symbol:** 21fbe117ab67431aabeb06843cf3475b

**Steps to Reproduce the Issue:**

1. Create a Symbol with responsive styles defined for custom breakpoints.
2. Insert the Symbol into a widget entry.
3. Observe that within the widget entry, the Symbol’s styles correspond to default breakpoints rather than the custom ones.

**Additional Information:**

- **Builder Content Link:** Symbol Content
- **Code Stack:** Next.js with React integration

---

<div class="post-metadata">

**Author:** ![ParthSharma](https://avatars.discourse-cdn.com/v4/letter/p/a9adbd/32.png) [@ParthSharma](https://forum.builder.io/u/ParthSharma)\
**Post date:** [April 2, 2025, 12:34pm UTC](https://forum.builder.io/t/symbol-styles-ignoring-custom-breakpoints-in-widgets/13460/2 "2025-04-02T12:34:14Z")

</div>

Hi Gaurav​,

I was troubleshooting your problem and checked in the builder and live environment. There is a slight difference in the area space around your symbol. Is that what you want highlighted?

I am attaching both screenshots. Please have a look and let me know.

 ![Screenshot 2025-04-02 at 5.58.25 PM](https://us1.discourse-cdn.com/flex020/uploads/builder/original/2X/c/c268af2dff28e7efde33c046bb4efecb2ede3bba.jpeg)  
 ![Screenshot 2025-04-02 at 5.57.43 PM](https://us1.discourse-cdn.com/flex020/uploads/builder/original/2X/d/d8609ad3af3f81848fc9367701a21dcd230a3f32.png)

Thanks,