Use Container Size in GHL Customer Care’s Page Builder to set width and height for any element, choose units, set desktop/mobile values without the need for CSS.
Assistants need to reach this page over the internet. While it is only running on your machine, these two buttons will not be able to load it.
Each image has a one line explanation. Switch to full detail for the step it belongs to, the fields and buttons involved, examples and the whole procedure.
Take precise control of every element’s size in GHL Customer Care’s Page Builder using Container Size. This article will show you how to set custom height and width, pick the right unit, and assign different values for desktop and mobile.
Container Size is a built-in control in the page builder that lets you define an element’s height and width directly in the builder. These values determine how much space an element occupies within its parent container (e.g., column, row, or section). You can choose units that best fit your layout goals and set device-specific values for responsive designs.
Key Benefits of Container Size Control
Precise Layouts: Fine-tune element size for exact designs.
Responsive Control: Set different values for desktop and mobile.
Unit Flexibility: Choose the between multiple sizing units to pick the correct one for the specific scenario.
Cleaner Builds: Achieve exact results in the UI instead of custom CSS.
Supported Sizing Units
Different units change how size is calculated. The following familiar web-design units are options so you can select the unit that works best for your project!
px – fixed pixel count (exact sizing)
% – percentage of the parent container
em / rem – scale relative to font size
vh / vw – viewport-based height or width
auto – browser decides optimal size
How To Edit Container Size
Follow these steps to give elements precise dimensions in just a few clicks:
Step 1: Open the Page Builder
Open the Page Builder for your funnel or website page by navigating to Sites > Funnels or Websites.
Select the Site/Funnel then open the Editor for the page you would like to edit.
Step 1: Open the Page Builder (image 1 of 5)What this shows Open the Page Builder for your funnel or website page by navigating to Sites > Funnels or Websites.What this showsIllustrates the "Step 1: Open the Page Builder" section of "Height & Width Controls for Page Builder Elements".This screenshot appears in the "Step 1: Open the Page Builder" section of "Height & Width Controls for Page Builder Elements". The text alongside this image reads: Open the Page Builder for your funnel or website page by navigating to Sites > Funnels or Websites. Select the Site/Funnel then open the Editor for the page you would like to edit. The navigation path used here is Sites > Funnels. Immediately after, the guide continues: Select the element you want to resize (text, button, image, form, etc.).Path: Sites > FunnelsImage 1 of 5Where to goOpen the Page Builder for your funnel or website page by navigating to Sites > Funnels or Websites. Select the Site/Funnel then open the Editor for the page you would like to edit.
Buttons and menus referencedSites > FunnelsWebsites.
Next stepSelect the element you want to resize (text, button, image, form, etc.)All 2 steps in this procedure
Open the Page Builder for your funnel or website page by navigating to Sites > Funnels or Websites.
Select the Site/Funnel then open the Editor for the page you would like to edit.
Step 2: Select Element
Select the element you want to resize (text, button, image, form, etc.)
Step 2: Select Element (image 2 of 5)What this shows Select the element you want to resize (text, button, image, form, etc.)What this showsIllustrates the "Step 2: Select Element" section of "Height & Width Controls for Page Builder Elements".This screenshot appears in the "Step 2: Select Element" section of "Height & Width Controls for Page Builder Elements". The text alongside this image reads: Select the element you want to resize (text, button, image, form, etc.). Immediately after, the guide continues: In the Right Sidebar, choose the Styles tab. Then scroll to the Container Size section.Image 2 of 5What to chooseSelect the element you want to resize (text, button, image, form, etc.)Next stepIn the Right Sidebar, choose the Styles tab. Then scroll to the Container Size section.
Step 3: Go to Container Size
In the Right Sidebar, choose the Styles tab. Then scroll to the Container Size section.
Step 3: Go to Container Size (image 3 of 5)What this shows In the Right Sidebar, choose the Styles tab.What this showsIllustrates the "Step 3: Go to Container Size" section of "Height & Width Controls for Page Builder Elements".This screenshot appears in the "Step 3: Go to Container Size" section of "Height & Width Controls for Page Builder Elements". The text alongside this image reads: In the Right Sidebar, choose the Styles tab. Then scroll to the Container Size section. Immediately after, the guide continues: Select a sizing unit (px, %, etc.) from the dropdown next to Height and Width. Then enter your desired size for Height and Width.Image 3 of 5Where to goIn the Right Sidebar, choose the Styles tab. Then scroll to the Container Size section.
Buttons and menus referencedStylesContainer Size
Next stepSelect a sizing unit (px, %, etc.) from the dropdown next to Height and Width. Then enter your desired size for Height and Width.
Step 4: Set Sizing
Select a sizing unit (px, %, etc.) from the dropdown next to Height and Width. Then enter your desired size for Height and Width.
Step 4: Set Sizing (image 4 of 5)What this shows Select a sizing unit (px, %, etc.) from the dropdown next to Height and Width.What this showsIllustrates the "Step 4: Set Sizing" section of "Height & Width Controls for Page Builder Elements".This screenshot appears in the "Step 4: Set Sizing" section of "Height & Width Controls for Page Builder Elements". The text alongside this image reads: Select a sizing unit (px, %, etc.) from the dropdown next to Height and Width. Then enter your desired size for Height and Width. Immediately after, the guide continues: Use the device toggle at next to Container Size to switch to Mobile View and enter a mobile-specific value if needed.Image 4 of 5What to fill inSelect a sizing unit (px, %, etc.) from the dropdown next to Height and Width. Then enter your desired size for Height and Width.Next stepUse the device toggle at next to Container Size to switch to Mobile View and enter a mobile-specific value if needed.
Step 5: Optimize for Mobile
Use the device toggle at next to Container Size to switch to Mobile View and enter a mobile-specific value if needed.
Step 5: Optimize for Mobile (image 5 of 5)What this shows Use the device toggle at next to Container Size to switch to Mobile View and enter a mobile-specific value if needed.What this showsIllustrates the "Step 5: Optimize for Mobile" section of "Height & Width Controls for Page Builder Elements".This screenshot appears in the "Step 5: Optimize for Mobile" section of "Height & Width Controls for Page Builder Elements". The text alongside this image reads: Use the device toggle at next to Container Size to switch to Mobile View and enter a mobile-specific value if needed. Immediately after, the guide continues: Q: Can I use decimals like 33.33% for equal columns? Yes! Decimals are supported for fine control (e.g., 33.33% × 3 cards). Validate on mobile to avoid unintended wrapping.Image 5 of 5What to fill inUse the device toggle at next to Container Size to switch to Mobile View and enter a mobile-specific value if needed.
Buttons and menus referencedContainer SizeMobile View
Next stepQ: Can I use decimals like 33.33% for equal columns? Yes! Decimals are supported for fine control (e.g., 33.33% × 3 cards). Validate on mobile to avoid unintended wrapping.
Frequently Asked Questions
Q: Can I use decimals like 33.33% for equal columns? Yes! Decimals are supported for fine control (e.g., 33.33% × 3 cards). Validate on mobile to avoid unintended wrapping.
Q: How do I revert changes? Set the unit to auto to revet the sizing to the element’s natural state.
Q: Will mobile values affect desktop? No. Values set in mobile view apply only to mobile, leaving desktop settings intact.
Q: Can I still use the Margin and Padding settings?
Absolutely! Height & Width control adds another layer, use all three together for complete layout control.
Q: Are negative or zero values allowed for width/height? Negative values (or 0) are not supported. If a number that is 0 or lower is entered, the element will remain at the current size.
