Jump to content

E-Ger

Member
  • Posts

    8
  • Joined

  • Last visited

  1. Thanks Paul2009 for the advice. I just raised a support ticket addressing Google Fonts and GDPR compliance. If this issue concerns you too, please approach them as well. I fully agree with atmesa's post and hope Squarespace will prioritize this issue quickly.
  2. Hi all, I am investigating the same issue and managed to replace the Google Fonts as described. However, as mentioned before there is a remainder in the code that I cannot remove: All fonts Fijalla, Franklin and Roboto have been uploaded and are saved locally. Is the issue therefore something only Squarespace can solve or is there anything that can be done to remove this? Thanks!
  3. Hello, I managed to resolve the issue. It had to do with another embedded code using the "Embed" feature rather than the code box pasted above. Moving the embedded code to the bottom of the page helped to recover the layout.
  4. Hi tuanphan, great you spotted this! Here is the code (3 blocks): [edit: 3 code boxes removed by author]
  5. Site URL: https://www.enactus.de/aachen/mitmachen Hi everyone, We have a webpage that displays incorrectly. In the webeditor, the page (in German) looks fine as you can see in the first screen shot. The icons are displayed properly and the text and video are at full size. In reality though this section looks completely different and by far too narrow. I cannot find any issues in the webeditor since the layout looks absolutely fine. Both screen shots were taken in desktop view. Does anyone have an idea? Thanks Tobias
  6. Thanks Creedon, much appreciated. Good news is that your CSS code resolves the issue I described and the website does not move anymore. Bad news is that the hamburger is not clickable anymore. This is my latest CSS including your changes and excluding the previous code. Any idea how to fix this? Thanks! <style> *, *:before, *:after { box-sizing: border-box; } /*html { font-size: 14px; }*/ body { /*color: #3c3c3c; font-size: 1em; line-height: 1.6;*/ background: #fa6900; overflow-x: hidden; } label .menu { --color : white; --size : 100px; background : var( --color ); border-bottom-left-radius : 100%; -webkit-box-shadow : 0 0 0 0 var( --color ), 0 0 0 0 var( --color ); box-shadow : 0 0 0 0 var( --color ), 0 0 0 0 var( --color ); cursor : pointer; height : var( --size ); position : absolute; right : 0; top : 0; -webkit-transition : 0.5s ease-in-out; -o-transition : 0.5s ease-in-out; transition : 0.5s ease-in-out; width : var( --size ); z-index : 1; } label .hamburger { background-color : #3c3c3c; height : 2px; left : 50%; position : absolute; top : 50%; -webkit-transform : translateY( -10px ); -ms-transform : translateY( -10px ); transform : translateY( -10px ); -webkit-transition : 0.5s ease-in-out; -o-transition : 0.5s ease-in-out; transition : 0.5s ease-in-out; width : 30px; z-index : 1; } /*label .menu { position: absolute; right: -100px; top: -100px; z-index: 100; margin-top: 0.9em; padding: 1em; width: 200px; height: 200px; background: #FFF; border-radius: 50% 50% 50% 50%; -webkit-transition: .5s ease-in-out; transition: .5s ease-in-out; box-shadow: 0 0 0 0 #FFF, 0 0 0 0 #FFF; cursor: pointer; } label .hamburger { position: absolute; top: 135px; left: 50px; width: 30px; height: 2px; background: #3c3c3c; display: block; -webkit-transform-origin: center; transform-origin: center; -webkit-transition: .5s ease-in-out; transition: .5s ease-in-out; }*/ label .hamburger:after, label .hamburger:before { -webkit-transition: .5s ease-in-out; transition: .5s ease-in-out; content: ""; position: absolute; display: block; width: 100%; height: 100%; background: #3c3c3c; } label .hamburger:before { top: -10px; } label .hamburger:after { bottom: -10px; } label input { display: none; } label input:checked + .menu { box-shadow: 0 0 0 100vw #FFF, 0 0 0 100vh #FFF; border-radius: 0; } label input:checked + .menu .hamburger { -webkit-transform: rotate(45deg); transform: rotate(45deg); } label input:checked + .menu .hamburger:after { -webkit-transform: rotate(90deg); transform: rotate(90deg); bottom: 0; } label input:checked + .menu .hamburger:before { -webkit-transform: rotate(90deg); transform: rotate(90deg); top: 0; } label input:checked + .menu + ul { opacity: 1; } label ul { z-index: 200; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); opacity: 0; -webkit-transition: .25s 0s ease-in-out; transition: .25s 0s ease-in-out; } label a { margin-bottom: 1em; /*margin-top: 1em;*/ display: block; color: #3c3c3c; text-decoration: none; } /*h1 { position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); width: 80%; text-align: center; }*/ </style>
  7. Hi everyone, we also have the issue that after having added a custom hamburger menu on a webpage, the webpage can be scrolled horizontally when displayed on mobile Safari browser. Following above advice I tried below code in Design > custom CSS already but it did not solve the issue yet, unfortunately. html, body { overflow-x: hidden; } The website is enactus.de/awa/home. Apart from the moving mobile page the hamburger menu works perfectly fine (links are not activated yet). The issue is most likely the white circle in the top right corner which probably needs to be cut? Thanks a lot!
×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.