rossbaynham

Hi there, After I press the burger and open my menu, the distance between headings on the first page is perfect, but too wide when you click through to the subheadings in the next menu. I have attached a screen shot of both. I want the distance on the one that says 'about' and 'contact' (the submenu) to be smaller. Does anyone have the code to change this on mobile only? Thanks Ross

Hi @tuanphan, just checking if you know how I can move the instagram logo only on mobile screens? Really appreciate your help!

Hi Tuan, This did exactly the right thing but I only want it to move on mobile! It's moved on desktop to.. is there a way where it can just target mobile? Thanks Ross

Can anyone help me with this?

Hi there, On mobile only, I want my instagram logo to be positioned in line with the right edge of photos - it somehow moved while I was messing about with code. I have attached images of the space. Can anyone help? Website is https://www.studio-teller.co/ Code is: header#header { position: fixed !important; bottom: 0 !important; left: 0; z-index: 9999; width: 100%; top: unset !important; background-color: transparent !important; padding-left: 4%; } .header-display-desktop .header-title { position: fixed !important; height: auto !important; width:170px !important; left: 5% !important; top: 10% !important; background:transparent !important; } .header .header-announcement-bar-wrapper { position: fixed !important; bottom: 0; width: 96vw; } article section:first-child { padding-top: 0 !important; } .header-title-text a { display: none; } .header-nav-folder-content { background-color:transparent !important; } .header-nav .header-nav-item--folder .header-nav-folder-content { bottom: 100% !important; } .header-nav .header-nav-item--folder .header-nav-folder-content, .fe-block-yui_3_17_2_1_1696953527203_1725 img { transition: 2s !important; } @media screen and (min-width:768px) { .fe-block-yui_3_17_2_1_1707684771869_37859 { position: sticky; position: -webkit-sticky; top: 150px; z-index: 99; } } @media(min-width: 768px) { header#header{ padding-right: 3%; padding-bottom: 2%; box-sizing: border-box !important; } } @media(max-width: 767px) { header#header{ padding-right: 0 !important; padding-left: 0 !important; box-sizing: border-box !important; } header#header .header-burger-btn{ padding-right: 0 !important; padding-left: 0 !important; margin-right: auto; } .header-display-desktop .header-title { width: 205px !important; top: 60px !important; left: 50% !important; transform: translateX(-50%) !important; } .header-display-desktop { display: flex !important; } .header-display-desktop .header-actions, .header-display-desktop .header-actions-action { display: block !important; } .header-display-mobile, .header-display-desktop .header-title-nav-wrapper .header-nav { display: none !important; } .header-display-desktop .header-title-nav-wrapper { flex: 0 0 0 !important; } .header-menu-nav-list .header-menu-actions.social-accounts { visibility: hidden; pointer-events: none; } .header-display-desktop .header-actions { order: 2 !important; margin-left: auto; } .header-display-desktop .header-burger { order: 1 !important; } .header-display-desktop .header-actions-action a{ margin-left: auto !important; } } .header-display-desktop .header-title-logo img { transition: 2s !important; } .header-display-desktop .header-title-logo:hover img { filter: blur(2px) !important; } .header-menu { .header-menu-nav-item a{ font-size: 20px !important; text-align: center !important; } .chevron { transform: none !important; border: 0 !important; width: auto !important; height: auto !important; font-size: 25px } .chevron--right:after { content: "↝"; } .chevron--left:after { content: "↜"; } [data-folder="/projects-1"] { min-height: calc(~"100% - 14vh"); } } @media screen and (max-width:991px) { div.header-announcement-bar-wrapper { padding-top: 3vw !important; padding-bottom: 3vw !important; } }

Ideally, I would also be able to move the gallery down a touch from the top of the page (but not as much as adding a whole 'blank' block). If anyone knows how..

Hi there, I want the gallery blocks on all my project pages to show landscape on mobile, like they are on desktop. Here is an example project page: https://www.studio-teller.co/lyndhurst-gardens Any help would be appreciated.

Hi guys, I am having trouble keeping my logo from jumping about at the top of my website when scrolling on iphone. I am totally aware that it'll move as the bottom address bar appears and disappears on iphones, but this is more jumpy and distracting than on other sites I have seen. I have added a fair bit of code to the site but if anyone can help it'd be much appreciated! Website: studio-teller.co Issue is on iPhone 13, have not tried it on android.

Amazing! This worked perfectly, thank you. Can I ask another question if you don't mind.. I am looking to slow down the fade in of the menu options slightly (ie make the 'about' and 'about the process' fade in more slowly when you hover over 'information'. Just to make it feel a little calmer and more elegant. Is do you know if there is code for this? Likewise, I would like to slow down the blur effect when I hover over the TELLER logo in the top corner. Any help would be massively appreciated!

@tuanphan is there any chance you could help with this? sorry to ask directly. Trying to get the menu folder to open above my navigation bar, instead of below. Thanks in advance

Bumping this up! Does anyone know the css to allow the menu folder to open above the navigation? Would really appreciate it!

Hi there, I am trying to mess quite heavily with my squarespace site to allow for a fixed image as a header (top left corner), and a fixed transparent menu bar along the bottom. This has flagged up an issue in the fact that the drop down folders from the menu headings drop down off the bottom of the window. Can I make these instead open 'up', above the menu? Attached screenshots of the overall home page and menu drop down issue. As an aside, the fixed menu at the bottom is also causing issues by pushing my instagram icon off the page. This is because I have left padded the menu 3% to allow it to resize in line with the fixed image header in the top left. Any help on brining the instagram icon back over a bit would be great! Website: https://purple-goose-k5e6.squarespace.com/ Password: TELLER Thanks Ross

Anyone have any thoughts on this? 🙂

hello all sorry yes, this was solved - I had added a certain piece of bespoke code in the CSS which was not allowing the box to open to give you options to add blocks. I had to troubleshoot deleting different bits of code until it started working again. Luckily the deleted bit wasn't needed! Ross

Site URL: https://www.rossbaynham.co.uk/ Hello On a section of my one-page website (image of section attached, right below the introduction) I have images pop-up when I hover over words, which works well on desktop. On mobile though, it shows these as individual links which is clunky. I would like to do one of two things: 1. Disable this feature completely on mobile so that you can't view the images (hopefully the simple option). 2. code some kind of nice alternative to the desktop hover, perhaps if you tap each of the words on mobile the image comes up on the phone screen for a few seconds? My website is here https://www.rossbaynham.co.uk/ Any help is hugely appreciated! Ross