How can I ensure that the page height is always 100% relative to the browser?
How can I prevent scrollbars from appearing on the right?
Always ensure that this scrollbar does not appear. Of course, it may appear when the browser is set very wide.
How should this panel be set up?
The site consists of only a header and one section.
Text is responsive.
Set the Header, Footer and Section or Sections to equal 100vh. Be mindful that the scroll bar will appear regardless unless you HIDE content that exceeds that space, and that is not recommended. This leaves you with the responsibility to make sure your content doesn’t by applying variable font sizes, hiding somethings on smaller screens, using percentages, and a number of other techniques.
Judging by your screen shots, I don’t think it will possible on the smaller monitors, laptops and mobile devices, unless you get dramatic with the variable font size settings.
Hi @teejay , thank you for replay,
Headers, footers and sections should be set to 100vh.
Which parts of the following image should this total to 100vh? Three different heights can be entered.
（The image is in Japanese, but it is made the same way as in English.
Also, in this image, ‘px’ is entered, which is the same as in the English version, where ‘vh’ can be chosen.）
When a text block is created and then variable text is applied, keep the width at a percentage, apply only docking to left and top.
Image similarly will have a percentage width with auto height.
The smaller the page gets the smaller all your content gets proportionally smaller with it.
Hi @teejay Thank you for your reply.
I understand the text and image settings.
For a page consisting of a header and one section, should the sum of the heights of ① and ② be 100vh? (There is no footer)
Where should this be entered in the image below? Is it correct to set, for example, 20vh for the header and 80vh for the sections? If so, where should the respective numbers be entered?
Correct. The sum of the ACTUAL HEIGHTS. The min-heights so be set at none. Because of what you are trying to achieve, make sure your overflow is hidden to make sure the scroll bars disappear.
Thank you @teejay ,
I’ll try it!!!
Hi @teejay , I owe my success to you. Thank you so much.
May I ask one more question of you?
If it doesn’t inconvenience you, please tell me one more thing.
This is a question about responsive.
Is it possible to keep the aspect ratio of the box in this slideshow always at 4:3 and the distance to the text on the right also always constant? Now the ratio of the box changes when I widen the browser.
When you drop the image in, don’t crop it, and then make sure you have the “Scale Proportionally” box select when working the image.
I see that the column where image is hasn’t changed either. Which mean the image should get smaller with the column, while the text one gets wider.
Play around with setting your left column to always fit the image, thus getting smaller with it. The other one would have a min width, but expand to replace the content.
You could also, utilize padding and margin control to keep the shape of the content altogether.
Thank you @teejay ,
I looked for “Scale Proportionally” in the slideshow box in the Pro Gallery, but it was not there. This is a slideshow of several images, not a single image.
Is it impossible to set “Scale Proportionally”?
Follow the container grid recommendation and make sure you set the images to fit.
Align the image to the right if you want to retain the space between copy block and image.
I hope this helps. Have fun playing around with all the variables.
Yoiichinichiwo
Thank you @teejay
I’ll try it!!!
Anata mo Yoi Ichinichi wo!
