Page 1 of 1

Percentage size with fixed aspect ratio

Posted: Mon Aug 15, 2022 4:49 pm
by tarsz
Hi!
Sorry if this is already answered, I tried searching, but didn't find anything.
I want to set a menu (Container) to follow the size of the window, without the ratio changing. I tried doing logic blocks, like having 5 different resolutions depending on window size, but that's a pretty awful solution. Is there a better one?
Thanks in advance!

Re: Percentage size with fixed aspect ratio

Posted: Mon Aug 15, 2022 4:54 pm
by tarsz
Also is there a way to do the same with font size? So it will fit within the rectangle at all times?

Re: Percentage size with fixed aspect ratio

Posted: Wed Aug 17, 2022 1:23 pm
by Tony
Hi,

This is the best that I could do:

https://rebrand.ly/P2VR7TXTRTSC

The text box uses CSS to set the text box at a specific percentage of the height of the viewport and css to maintain a ratio of 1:1.

You can read more about how to set the responsive ratio in my tutorial "Maintaining the Aspect Ratio of an iFrame" as it applies to a text box. https://tonyredhead.com/pano2vr-little- ... tio-iframe

The text changes by applying a CSS Class to the text box using font-size: and a text size "x"vw; You can read more about it here https://css-tricks.com/viewport-sized-typography/

Have fun :-)

Tony

Re: Percentage size with fixed aspect ratio

Posted: Wed Aug 17, 2022 3:47 pm
by tarsz
Thanks! That's actually exactly what I've been looking for!