Webflow sync, pageviews & more.
NEW

How can I delete columns in the grid at the bottom of the page for mobile and tablet views on my Webflow site?

TL;DR
  • Select the grid element in Webflow Designer.
  • Switch to Tablet or Mobile view using the device switcher.
  • Adjust Grid settings by reducing or merging columns.
  • Hide specific grid items using the Display settings.
  • Preview and publish changes to apply updates.

To remove columns in a grid for mobile and tablet views in Webflow, follow these steps while ensuring your desktop layout remains unaffected.

1. Select the Grid Element

  • Go to the Webflow Designer and navigate to the bottom of your page.
  • Click on the grid you want to modify.

2. Switch to Tablet or Mobile View

  • Use the device switcher at the top of the Designer to select Tablet, Mobile Landscape, or Mobile Portrait.

3. Adjust Grid Layout

  • Open the Style panel (on the right).
  • Find the Grid settings.
  • To remove columns:
  • Reduce the number of columns in the Grid settings by selecting the unwanted column and clicking the delete icon (-).
  • Alternatively, you can merge columns to adjust spacing.

4. Hide Unwanted Grid Items

  • Instead of deleting columns, you can hide specific grid items:
  • Select the element inside the grid column.
  • Go to the Style panel → Display settings and choose "None" to hide that element on mobile.

5. Preview & Save Changes

  • Use Webflow’s preview mode to confirm the changes look correct.
  • Publish the site to apply the changes.

Summary

By adjusting the grid settings or hiding specific elements, you can remove columns for mobile and tablet views without affecting the desktop layout.

Webflow Resources
Webflow templates
Webflow inspiration
Rate this answer

Other Webflow Questions

Explore Logic tutorials
How can I highlight the 'current' page in Webflow CMS collection template pages for my nav-bar links? (For example, I have a page called 'case studies' that shows items from a CMS collection also called 'case studies'. When showing the CMS collection template page for each case study, I want the nav link for 'case studies' to be highlighted to indicate the user's current location on the site). Can anyone suggest a solution? Thank you.
Is there a simpler way to create an image gallery in Webflow, where I can add multiple pictures at once and have it automatically create thumbnails using a lightbox tool or another method?
How can I set a large paragraph with line breaks in Webflow CMS Collections?
Is it possible to implement a single scroll navigation like the one shown in the example using Webflow and a third-party tool or integration?
How can I make an image fade in smoothly after a page finishes loading in Webflow?
How can I display the copyright symbol © in a Webflow text block on Windows?
How can I solve the error message "Passwords cannot be submitted" when using the Webflow platform to create a website with a form containing a password field?
Why is the video in my Webflow preloader not showing up on mobile devices?
How can I integrate my website page with my Twitter account using Webflow?
What could be causing my Webflow dropdown menu to not work in both the published site and preview mode?
How can I install a countdown timer widget on my Webflow site?
Can Webflow create a feature similar to Typeform?
Why do SVG images on my Webflow website appear blurry on mobile and tablet devices, but not in the previewer or when using JPEGs?
How can I delete a symbol in Webflow without deleting my original work and create a new symbol from an existing symbol?
How can I get Webflow to allow access to the API and stop blocking the cross-origin response with MIME type application/json?
Can Webflow be used to call a CSS or JS file stored on a different server, instead of hosting them on GitHub?
How can I use the Finsweet script to manage two different sliders on my Webflow page, each feeding content from different collections?
How can I prevent a full-screen slider in Webflow from pausing on hover? Additionally, I would like to link two sliders to one control or navigation. Can anyone with JavaScript knowledge help me achieve this?
How can I change the language of publication dates in Webflow CMS collection from English to Portuguese?
How can I dynamically redirect to a CMS created after form submission in Webflow?
How can I hide the "no items found" empty field in Webflow for a second multi-image gallery on certain pages?
How can I implement swipe functionality between tab panes on mobile using custom code in Webflow?
How can I disable right-clicking on images to prevent downloading on my Webflow portfolio website?
In Webflow, how can I hide specific elements in the footer (such as "Ramin Khaze The Difference" and "Schedule showing") when the URL contains a certain parameter, such as "?mls"? I am a beginner in coding and would appreciate any help. Thank you!
How can I prevent the "w-current" class in Webflow from overriding the height of my custom class on a link block element?
Can anyone help me add a digital clock and date to my Webflow site? I've been able to add custom code, but I need assistance with styling the text. Thank you in advance for your help!
Can I capture a screenshot of a Webflow page on click and convert it to a downloadable PDF?
How can I pull the stored email from the first form submitted on our website and input it into a field on a later form during the sign-up process in Webflow? I have tried using the provided script but it only displays "undefined" in the field. I don't have much knowledge of JavaScript and found this script online.
How do I mirror user input from a form field to a non-form text field on the same Webflow page in real-time using JavaScript?
When will Webflow update the "Select Field" component to allow for a placeholder with different colors before and after selection, without the need for a label above the field?