How to Adjust a Section Width on Desktop Only Without Affecting Mobile View?

Ask the community
1

:rocket: 2026 Updates: Editing Desktop Width Without Duplicating

Changes & Current Status:

  • When this question was originally answered, the primary workaround for device-specific structural changes was to duplicate the section and use the “Hide on Mobile/Desktop” toggles.

  • Today, Funnelish features native Responsive Properties. You no longer need to duplicate your sections, rows, or elements to adjust their width or spacing for a specific device.

Up-to-Date Information for Responsive Widths: You can now adjust the width (or margins/padding) on Desktop without it affecting your Mobile layout by doing the following:

1. Use the Device Toggle Icon: When you click on your Section or Row and look at the settings panel on the left, you will notice a small device icon (a monitor or phone) next to almost every property setting (including Width, Margins, and Padding).

2. Adjust While in Desktop View: Switch your main canvas view to Desktop using the icons at the very top of the screen.

3. Change the Width: Adjust your width or padding values. Because of the new responsive properties engine, Funnelish will recognize that you are in Desktop mode and will only apply this new width to the Desktop breakpoint. If you switch your canvas back to Mobile, you will see that your mobile width remains completely untouched!

Tip: You only need to use the old duplication method for elements where the core content (like custom HTML logic) needs to be drastically different. For sizing, alignment, and styling, always use the responsive toggles.

Related Articles & Resources:

**"I am working with a section in Funnelish, and I want to make it responsive for both desktop and mobile views. Specifically, I want to be able to adjust the text within the section and have it display correctly on both desktop and mobile. However, the only change I want to make is to the width of the section on the desktop view, while ensuring that the mobile view remains unchanged.

The issue I am facing is that when I adjust the width on the desktop view, it also affects the mobile view, which I do not want. I need a solution where I can change the width of the section for the desktop version only, without impacting how it appears on mobile devices.

Additionally, I want to avoid duplicating the section and creating separate versions for desktop and mobile. I am aware that this is one possible solution, but I prefer not to go down that route.

How can I adjust the width of the section specifically for desktop view in Funnelish while keeping the mobile view intact and responsive, without duplicating the section?"**

2

Hi @ecomdime,

In this case, if you only want to edit a specific element, row, section in desktop without it affecting it in mobile the only way to do this is through these steps:

  1. In the desktop view, just click on that section, row or element you want to edit separately in the other view and duplicate it.

  2. Click on the one above > Hide it on mobile and tablet by deactivating the mobile and tablet responsive property

  1. Then click on mobile view and hide it on desktop by deactivating the desktop responsive property:

Once you’ve done this you can edit them separately without affecting each other.

This can be done with whichever section, row, container or elements except in the following cases:

:red_exclamation_mark:Sections, rows or containers containing a product list element and/or payment form elements

:red_exclamation_mark:Product list elements and payment form elements

You can check this loom for reference: Edit Separately âś… | Loom

If you want to read more about this, have a look at the article here which has more details around the responsive properties: https://docs.funnelish.com/advanced-features/responsive-properties

Best,
Belén@Funnelish