Tonmeister

Thank you so much!

Site URL: https://rotor-film.squarespace.com Dear All, I am using two columns of text blocks for addresses on the footer of this website: rotor-film.squarespace.com On mobile, it displays the second column (the right one) first, instead of last! Can anyone hint me how to change this? Thx+Best! Tonmeister

Site URL: https://rotor-film.squarespace.com Dear All, All of a sudden (must have been some change at squarespace) I have an issue with my website: The first hero background image on the home / landing page is blurry / low resolution on mobile (iOS 14 / iPhone7). If you look at the "Where Stories Unfold" slogan in the middle of the image, you notice it looks like heavy jpeg compression, on desktop everything looks flawless. Again, I didnt change anything on my website, it just appeared one day. Can anyone help? Best, Gregor

Hey @abacostudios I have the exact same problem. First Hero background image is blurry on mobile (iOS) and this is something that happened all of a sudden, has been sharp for years. This is my site: www.rotor-film.de How did you fix your problem? It seems to be fine on your end now. @tuanphan could you take a quick look? Best, Tonmeister

Yes I still need help! I use Chrome version 87.4280.77 and Safari version 14. The change happened when I upgraded my iPhone to iOS 14: When height of a div is set to "0", box shadow will not be rendered, instead I get a grey box. On any desktop browser it's rendered correctly, even if I simulate iPhone in chrome -> developer tools -> devices. Any ideas on how I could fix this? Best, Gregor

Site URL: http://www.rotor-film.de Dear All, Today I noticed a display error on my website, when opening from iPhone (both Safari and Chrome). The Error did not occur about a month ago, so perhaps my upgrade to iOs14 had sth to do with it / or sth within Squarespace changed. All my box-shadows won't render anymore on iPhone: On desktop it looks like this: I coded the box-shadow as a background for the text. Notice that I set the height to 0!important. That way I don't have a square div, with a box shadow around it, but instead I get just a "cloud" shadow: .gallery-caption { width: 28em; height: 0!important; -webkit-box-shadow: 100px 20px 120px 170px rgba(0,0,0,0.75)!important; -moz-box-shadow: 100px 20px 120px 170px rgba(0,0,0,0.75)!important; box-shadow: 100px 20px 120px 170px rgba(0,0,0,0.75)!important; } I notice, that when I set height to anything but 0 (e.g. 1em), the box shadow renders correctly again even on iPhone! However, for my purposes I need it to be 0, in order for it to look like a cloud. Do you have any suggestions? All the best + Thanks in advance! Gregor

Great. Thank you so much!

Site URL: https://wisteria-panda-z2eg.squarespace.com/ (pw: rotorrotor) Dear All, I have a footer menu (basic html element) at the very bottom of my website: When I scroll down my website top to bottom, each element appears one after the other, the footer menu being the very last. Is it possible to disable the "appearing" effect for this element, because it is too important for people to wait for it. I would like them to see it right away. I already tried to disable transition-timing-function as well es delay and duration, with no success: .footermenue { ... a {transition-timing-function: none!important; transition-duration: 0s!important; transition-delay: 0s!important; } } Any hints would be much appreciated! Best, Gregor

That did it. Thanks a bunch!!

Site URL: https://wisteria-panda-z2eg.squarespace.com/people (no password needed for site) Hello All, I am aware I can size the social icons through squarespace's interface when editing the header. However, I would like to size the social icons differently according to screen sizes, but I haven't been able to target them properly. Currently, header social icons are set to 25px. What should my CSS look like in order to make them 32px when screen is wider than 1800px? Thanks ahead!! Gregor

This seemed to have fixed mine: <style> body[data-menu-overlay-theme-switcher="true"]:not(.tweak-transparent-header) .header.black { background-color: rgba(0,0,0,0)!important; } </style> Hope it helps anyone.

Same problem here, I used this code in page's header injection, now stopped working. Please @SQUARESPACE, don't randomly change classes. Also, why did the OP label this thread "solved"? It clearly isn't. <style> .header-announcement-bar-wrapper { background: rgba(0,0,0,0)!important } </style> Best, Gregor

Thank You, that works!!

@tuanphan No, I just used a spacer. But this gives me uneven results depending on display. I just removed the spacer, can you give it a go? Thank You 🙏

perfect!! Thank YOU