Is it possible to set a custom percentage width for columns in Webflow, specifically for three columns that are set to approximately 40%, 40%, and 20%?
Yes, it is possible to set a custom percentage width for columns in Webflow. Specifically, for three columns that are set to approximately 40%, 40%, and 20%, you can follow these steps:
Open the Designer of your Webflow project and navigate to the page where you have the columns you want to modify.
Select the element containing the three columns. This could be a
div,section, or any other container element.In the right-hand panel, go to the Styles tab.
Locate the Flex Layout settings and enable it if it's not already enabled. This will allow you to apply custom widths to the columns.
Inside the Flex Layout settings, you will find options for distributing space between the columns. By default, it is set to "Justify," which means the columns share the available space evenly. However, in your case, you want custom widths, so we need to change this setting.
Set the Justify setting to "Start." This will make all columns align to the start of the container.
Now, you can individually adjust the width of each column. In the same Styles tab, locate the width settings for each column. Webflow allows you to enter both fixed pixel widths and percentage values.
Set the width of the first two columns to approximately 40% each, and the width of the third column to approximately 20%.
Preview your changes to ensure that the columns are displaying as desired. You can do this by clicking the Preview button in the upper right corner of the Designer.
By following these steps, you will be able to set custom percentage widths for columns in Webflow.
Additional Resources:
Potential search queries:
- How can I set custom percentage widths for columns in Webflow?
- What are the steps to adjust column widths in Webflow?
- Can I set individual percentage widths for columns in Webflow?
