AlinaH

@tuanphan Remove the white space on the bottom and stop the cover image from shifting upwards under my header at the top (It's semi-transparent by design). That's what you can see in the first screenshot, then if I nudge the screen it jumps in place as in the last screenshot. But that's how it should be at all times, without the need to nudge. The image is set to be the exact screen size on mobile, and not supposed to move anywhere outside of it. The idea is that its a fixed homepage.

Hi @tuanphan ! Would you happen to have seen anything like this before? I've set different vh and px values but the issue persists.

Hi David, Thank you, I changed the code to the one you wrote and experimented with different vh values but it only enlarged an image and made the page scrollable, it still pushed the image under the header when first opened. I've tried many different code variations that should have been successful, but it's as if SquareSpace system doesn't read it. Not sure what's going on.

Hi - Anyone else has this problem with Squarespace? Everything on my page worked fine when I set it up months ago. Recently though I noticed my homepage image scoots up under the header when I go on the site. Only on mobile screen. Soon as I nudge the screen a bit - it sets in place. But it won't do so on its own, even after some time. The idea here is that I have a set, still front page, that fits just within the screen and doesn't scroll anywhere. Here's the code I had, and which worked fine before. @media screen and (max-width:767px) { section#feature { min-height: unset !important; height: calc(~"90vh - 96px") !important; } } @media screen and (max-width: 767px) { #feature {min-height: 78vh! important} } I tried removing one of them and using only the other, setting only specific height, as well as adding these commands to the first, but no success: transition: height 0.1s ease; transform: translateZ(0); I feel like squarespace always makes some internal update and it inevitably will mess something up in any one of my codes.. Site: alinahetz.com

This did it! Thank you so much @tuanphan!

This seems to be more tricky than I can manage – On my site alinahetz.com I made the home page full screen, fixed page - as in it *shouldn't* scroll up or down. Just sort of be one full screen page. It works on desktop and I figured out how to make it that way on iPhone but it doesn't seem to apply to all. My media max-width is set to 767px, changing it to 640px as I also see used a lot does nothing. The page is displayed fixed and full screen on my iPhone 11 Max and on a 14 Pro. On standard iPhone 14 the image or page shows up short - so there's a white area on the bottom. Instead of me changing vh back and forth - is there a code that would automatically adjust the height of my home page to all mobile screens to sort of fit it exactly and not move around? I know it's tricky but thanks in advance if anyone knows how to navigate this! Right now the css I have running looks like this: @media screen and (max-width: 767px) { #feature {min-height: 78vh!important} } (*putting 100vh makes the page too tall and it starts to scroll)

Hi! Tried it but it didn't seem to change anything..

Hi! This ALMOST solved my issue - my drop down menu navigation worked only on chrome and after I used this code, it scrolls on mobile but a bit past the section needed, but still no action on desktop Safari - it still opens top of page no matter what title I select (under "services"). Is there anything I can adjust to make it work on all software and devices? https://www.alinahetz.com/

Hi! I added SERVICES tab onto my navigation and when you click on any of the titles in the dropdown menu it takes you to that section on a single page. This works on desktop in Chrome. But on IOS mobile or desktop Safari no matter what title I tap on, it just takes me to the top of that page. Can anyone help me resolve this? https://www.alinahetz.com/ Thank you, Alina

@Ziggy That fixed it! Really appreciate your help 🙂

Hi, been reading through articles but nothing I’ve tried works so far and I don’t have the new 7.1 version. The project order on the desktop site looks perfect - left to right: Edgewater - 50 W - Park Ave - Forest Hills. When I open this page on mobile it displays projects as Edgewater - Forest Hills - 50 W. How do I make mobile page display projects in the same order as on desktop? Losing my mind here, any help will be very very appreciated! The way I built it was by adding one image then another on the right of it, then another on the right of the last, then adding one under the first - to start a new row. I tried creating this in just new gallery page, inserting line and spacers between first and last project images that are displayed on top of each other on desktop, adapting and inserting codes I found on other threads,.. ugh https://www.alinahetz.com/projects