Erlend-fs

Thanks for your reply Beyondspace. With drag element in Fluid Engine, I'm able to make a mobile and a desktop layout. But not the tablet layout. In desktop layout, I want four images in a row. (accomplished) In tablet layout, I want two images in a row. (not accomplished) In mobile layout, I want one image in a row. (accomplished) Any way to do this?

Hello! By using custom CSS in Squarespace 7.1 with the Classic editor, it's possible to control the number of columns by the width of the screen. As an example, the images on this site, appears in: one column on mobile (below 450px) two columns on tablet (screen size between 450 and 980px) four columns on desktop (screen size wider than 980px) This is controlled by the CSS coding below. My question is: With the Fluid Engine, is it possible to do something similar (with or without custom css)? /* Bildemenyer - Two column on tablet and mobile*/ /*Tjenester fra tau*/section[data-section-id="602cca273f845d30031c13b6"], { @media screen and (max-width: 980px) { .span-12 .span-3 { width: 50% !important; float: left !important; } } /*Tjenester fra tau*/section[data-section-id="602cca273f845d30031c13b6"], { .span-3 .sqs-block-content { width: 100% !important; } } } /* End- Bildemenyer - Two column on tablet and mobile*/ /* -------------------Bildemenyer - one column below 450px--------------*/ /*Tjenester fra tau*/section[data-section-id="602cca273f845d30031c13b6"], { @media screen and (max-width: 450px) { .span-12 .span-3 { width: 100% !important; float: left !important; } } /*Tjenester fra tau*/section[data-section-id="602cca273f845d30031c13b6"], { .span-3 .sqs-block-content { width: 100% !important; } } }

Hello! I'm new to Fluid Engine, but it seems really good. Link to the page I'm working with: https://www.hoyden.no/fallsikringskurs-fluid I wonder if there is a good way to make the text on this section break into "one column" (appear above and below each other, rather than beside each other), on screen size smaller than 1300px? I have earlier achieved this with the classic editor by adding the CSS code below. This does not work after upgrading the section to FE, and I guess it is because FE does not use columns in the same way as the classic editor. So, is there some other code or another way to achieve this, after upgrading to FE? section[data-section-id="609a48d7e92ddb651e864899"], { @media only screen and (max-width: 1300px) { .col { width: 100% !important; }}} I want the text in the circle to appear under the other text box, when screen size is below 1300px '

That's correct, I have attached two and two logos together. This is beacause I want a two column layout in mobile, and the pages breaks very nice into this when two and two logos are attached together. But if there is a better way of doing this, I am very happy to change it. Any suggestions, how to solve both things? Erlend

Hello! I know it is "best practice" to always upload compressed images to web reduce load-time etc. But I wonder if Squarespace anyway will compress the uploaded files, so there will be no need to do it beforehand? I'm adding a link to a page where I have made an image gallery (slide-show), built in Squarespace 7.1, Fluid Engine: https://www.hoyden.no/universitetsgata-7 (The images in this slideshow is not compressed before uploading) Erlend

Hello again! Yes, I got help from Squarespace support to remove this. Thank you anyway tuanphan!

Thanks for your reply Tuanphan. I tried this now, but the it become a huge blank space in the site (see screenshots below). And still some "sample text" there.. Do you have any other suggestions?

Site URL: https://www.hoyden.no/fallsikringskurs Hello! Default template text ("Make it stand out") has appeared in between the content on our website. I'm not able to edit/ remove the text in the editor... Anyone know how to fix this bug? See images below and link to the website https://www.hoyden.no/vindusbytte https://www.hoyden.no/fallsikringskurs

Site URL: https://www.hoyden.no/munchmuseet Hello! I have uploaded logos beside each other on this page. When the site is viewed on a large screen (above approx 1700px), the images gets more space between them, and disturbed horizontally along the whole screen. But I want them to be aligned to the left, with the same spacing all the time. Is there a easy way of doing this?

Great thanks!!

Thanks a lot bangank36! Is there also a way to remove the spacing beside the text (below 767px), so the footer will be completely left and right aligned? (see attached image). It would be great!

Site URL: https://www.hoyden.no Hello! I've made a really simple footer. It contains of two text boxes beside each other. On desktop, the page displays as I want. Under 767px (on mobile), the footer breaks into two different lines upon each other. I want the text to be beside each other. Anyone with a suggestion for how this could be solved? It's built up with two text boxes besides each other: (left aligned to the left and right aligned to the right) It looks correct on desktop: On mobile (below 767px) it breaks into two lines upon each other, and I don't want this

Thanks for your reply tuanphan. I did as you suggested, and found a solution:)

Site URL: https://www.hoyden.no Hello! I have installed this plugin to get a mega-menu on our site: https://thompsonweb.design/squarespace-plugins/p/mega-menu-plugin-squarespace Our header menu has a transparent background when you are on top of the page. When you scroll down, the menu gets a background color. When you hover the menu, the mega menu appears below the header menu. And when you do this when you are on top of the page, it looks a bit strange, since the mega menu has a background color. I wonder if it's possible to make the header-menu have a background color when you have "opened" the mega menu? So that everything displays with the same background color? Har to explain, but I'm attaching a screenshot. It would be great if anybody could help with this. www.hoyden.no Erlend

There is no problem anymore here. But I found a workaround to fix the bug. By making two identical header sections, and using this code the advanced section in the setting of each page (found in this guide) <style> @media only screen and (max-width: 780px) { #page section:nth-of-type(1) { display: none; } } @media only screen and (min-width: 781px) { #page section:nth-of-type(2) { display: none !important; } } </style> This makes the first banner section appear on desktop, and the second banner section appear on mobile. For some reason, this fixes the bug, and the mobile banner page appears in good quality.