Can someone help me set my hero element to 100% height using custom code?

make sure your selected elements have the appropriate class attached to it (select your #bar section, where it says “Custom classes” type in ‘bar’, do the same thing for your hero section) Another feature that might solve your issue is to select your bar section and change the position type to Stic…

You can do this without code in Wix Studio. If you select the “…” next to the “Size” section of the Inspector you can turn on advanced sizing: [image] Then you can select a variety of different units for height including %. [image]

% option. is not showing for Sections elements, which is what I need. [Screenshot 2023-10-11 at 16.03.53]

Are you part of Wix team? Can you ask your developers to implement this? If you want Wix Studio to be a serious tool for professionals it needs to have features like this.

I see. In this case % height is not shown as the section can be thought of as a div/uppermost container. It doesn’t have anything to be a % of. It needs to be a height either relative to something (like viewport height, which is a % of the total height of the viewport) or an absolute height (like pi…

Here is a design I am working on. Note the bar at the bottom of the design. This whole header section ideally needs to fit perfectly on the screen. However, on IOS, this is not possible without using %. If you use VH, the address bar on IOS overlays the header section so it doesn’t fit perfectly in …

I mean make the page min height 100%

Can you share a screenshot of how it looks on iOS?

Here is a link. I set the image to 85vh and the bar at the bottom to 15vh. So it should fit perfectly in the viewport. But as you can see the bottom bar is cut off. It needs to be in % for IOS for it to fit perfectly. https://cjechurchill.wixstudio.io/my-site-3

While I don’t have an iOS device to check this it does seem like there are new units for viewport height including svh, lvh, dvh and these might solve your problem. This might also be something Wix could improve and offer in the editor. You could try assigning classes to these sections and then sp…

Am I doing this right? The CSS doesn’t seem to have any effect on the website [Screenshot 2023-10-12 at 20.31.32]

How do I use Wix Code to set 100% height. I WANT % NOT VH

Ask the community

anthony October 13, 2023, 2:44pm 16

I made a request here: Add new unit types to sizing options

Topic		Replies	Views
How can I set the section height to 100%? Ask the community wix-studio , question	2	811	March 11, 2024
How to Make a Section Full Height (100vh) in Wix Editor Ask the community wix-studio , code , wix	3	355	April 30, 2025
Full Screen Header Section - Code Issue WIX Classic Ask the community code	0	13	December 19, 2025
Set max width for an entire page/section (Wix Studio) Ask the community wix-studio	41	7474	July 24, 2025
Can't change section heights Ask the community wix-studio , wix , question	3	90	October 13, 2025

How do I use Wix Code to set 100% height. I WANT % NOT VH

Related topics