Vertical sizing of viewport in work area

This was discussed in the last Q and A with CEO Vlad Magdalin, but I've just been realizing how important this feature is.

I've been working with someone with a small laptop, and she has shared her screen with me to show how wrong my assumptions are about how the site looks on that size of screen.

I currently like to work in full screen mode on my 27 inch monitor. I can take the browser out of full screen mode, and shrink it way down to get an idea, but then my menus and palletes also shrink, making it hard to work. It'd be much easier if I could just drag the bottom the same way, but keep everything in full screen mode. It would also just be faster to try different screen sizes.

Another issue that this would help address, is elements set in VH units. As it is I guess, and then go test later, but this would allow for much more fluid fine tuning of these elements.

It would also be great to have vertical setting for different laptops, etc., to know what realistic heights actually are.

  • Skyler Kline
  • May 31 2018
  • Aaron Clark commented
    April 27, 2023 14:56

    Here we are in the year 2023, and this feature still hasn't been implemented. Come on y'aaaaaaaaaaaall (webflow team)

  • Click Click commented
    June 25, 2019 17:16

    Must be thanks for the given this niec article get dark dimensions mahjongg game and have to seen the batter working.

  • Skyler Kline commented
    November 13, 2018 17:58

    Something else I was just thinking could help this feature, would be to have the settings available where the interface puts a transparent black over the interface of the hidden portion of the site, but still allows you to test different viewport heights, with accurate sizing for anything sized with a VH or VMIN/VMAX units. This could be handy in that it would allow us to see whats below the lower edge of the screen, but still understand how our site is reacting to different screen heights.

    For clarity, I think still having the option to hide everything below the bottom edge would also be useful, as it would be a truer visualization. But sometimes being able to see the big picture of a scrolling site can be useful for certain tasks... 

  • Skyler Kline commented
    September 05, 2018 01:15

    It's not that resizing the browser doesn't give you an accurate preview. It's that it makes your menus and tools phone sized. 

    One of the things I love about Webflow, is that when you are working on responsive sites, is that you can preview any size, and keep making changes. Muse wouldn't let you do this, and it could get pretty tedious.

    If you could set it in the canvas, you'd still be able to keep your browser in full screen, have all your menus, but still see how it responds to a small height.

  • Eryc da Silva commented
    August 30, 2018 22:25

    Can't vote anymore, but this is something I've been hoping for as well.

    I've been needing this resizable height while designing my website to mock the experience on different phones.

    If I resize the browser window, as Nelson mentioned, I will be sacrificing my experience with Webflow's design controls.

  • Admin
    Webflow Team commented
    July 27, 2018 23:05

    Hi Marcel,

    Thanks for the reply. VH doesn't respond to the viewport width. Only the height. 

    If we were to implement a canvas height resize feature, like how you can resize the width, it would work the same way as resizing your browser height.

    This is why I suggested that. 

    Hope this clear up any confusions.

    Cheers,

    Nelson

  • Marcel Deelen commented
    July 27, 2018 22:49

    haha, that is a bit of a low tech solution Nelson. It would be handy if VH would automatically relate to the previewed viewer width. Little dotted line or something to mark it would be handy too.

  • Admin
    Webflow Team commented
    July 27, 2018 22:26

    You can test the viewport height by shrinking the height of your browser window.

    - Nelson, Customer Success Specialist

  • +9