DavvaMC

Hi Please could somebody help on is, I have been trying and trying to reduce the padding or the height of the footer. Nothing I try seems to work. Any ideas as t what I need to add to custom css? https://www.cn8.co.uk/about-us Many thanks

Hi When I view the home page in responsive mode, and select iPad Pro the background image of the Swan is getting cut off. I cannot see why in the CSS. I am also trying to achieve a 100% height of browser for all pages so their i no scrolling, but not sure I have set this up correctly. Please can someone help me?

Hi I have tried everything in CSS but I cannot seem to reduce the padding of the footer. I want the content to be very tight. Not sure if it is the swan image that is causing this, if so how do I make this image smaller with CSS, can't seem to do it in Squarespace editor as it becomes too small. Many thanks

Hi No sure if I need to create separate mobile background image or can use CSS to resize. If you look here on mobile the swan image is to far to the top and also the wings get cut off. If I do need to create new images what is this ideal size? Lastly on mobile view I cannot get the footer links o align centrally. Please could someone help me? https://www.cn8.co.uk/new-home Many thanks

Thanks, I think I have sorted it now. Much appreciaed.

Yes I finally worked out how to do it this morning.

I would also like to know how to do this.

Great thanks for your help.

Sorry I am also trying to change the width of the orange button, when viewed on smaller screens the text wraps. Thanks

Hi I have added custom css to display a background image when viewed on smaller screens. When I view through a responsive tester and view the ource code it says the image being used is he desktop image? Here is my code @media only screen and (max-width: 1024px) { section[data-section-id="6673e1f8a3a59808965c32da"] .section-background img { opacity:0 !important; } section[data-section-id="6673e1f8a3a59808965c32da"] .section-background { background-image:url('https://static1.squarespace.com/static/5fec63b71c227637fcd74134/t/6673f279c0893213adf3ed95/1718874746151/hero-home-mobile.jpg') !important; background-size: contain; background-position: 40% 100%; background-repeat: no-repeat; } section[data-section-id="6673e1f8a3a59808965c32da"] .sqs-block-button-container { border: 1px solid red; } } What am I missing? Please view here - https://www.cn8.co.uk/new-home Many thanks

How would we acheive this to target sizes like below? 768px 810px 1024px It only seems to work for small screen sizes. Thanks

Hi I have an unordered list in my footer with separaors in between each link. Have been trying to remove the last separator from the last link but with no joy. This is what I have. footer ul { display: flex; list-style-type: none !important; margin: 0 !important; padding: 0 0 10px 0 !important } footer ul li p:before { display: none !important; } footer ul li p { display: inline !important; list-style-type: none !important; padding: 0 !important; } footer p { color: #fff !important; font-size: 0.9rem; margin: 0 !important; padding: 0 !important; } footer li:after { content: " | "; padding-right: 8px; } footer li:last-of-type { content: ""; } footer .content-wrapper li a { color: #fff !important; font-size: 0.9rem; font-weight: normal; text-decoration: none !important; } footer .content-wrapper a:hover { color: #ff662f !important; } footer .content-wrapper a:active { color: #ff662f; } What am I doing wrong? Much appreciated.

Hi Can't for the life of me get the rollover colors on links to work with custom code. This is what I currently have. } .header-nav-item a { color: #fff; } .header-nav-iem a:hover{ color: #000 !important; } .header-nav-iem a:active{ color: #ff662f !important; } /*MOBILE MENU*/ .header-menu-nav-item a, a .header-menu-nav-item-content { font-size: 14px; text-decoration: none !important; } nav.header-menu-nav-list .header-menu-nav-item * { background-image: none !important; text-decoration: none !important; border: none !important; } .header-menu-cta { color: #ff662f !important; padding-bottom: 15vh !important; } .header-menu-cta a.theme-btn--primary.btn { color: #ff662f !important; background-color: transparent !important; border: 1px solid #fff !important; } .header--menu-nav-item-active a{color:#7bb6b1!important;} /*END MOBILE MENU*/ I also need to change the rollover fo the CTA button when you open the mobile menu. Any ideas as to what I am doing wrong? https://www.cn8.co.uk/new-home Thanks

Thanks, I will give it a go.

Thanks, I have selected no-gap and horizinal gap = 11 But the image and blach boxes also need the same gap. But if I do that the text above the image blocks space increasing and I cannot then align the sub text closer to the title as it is snapping to the grid! Phewww hope that make sense!

Here is the page the footer ul also has bullets that I cannot get rid of 😞 https://www.cn8.co.uk/new-home PW: KINO-CN8 Thanks

Thanks if I select no-gap it means when i add an image and text blcok in one halpf and an image and text blok in another half the vertical gap is also 0. Would I need to add custom cs to give a space in between (vertically) Hope that makes sense.

Hi Could someoe help or lead me in the right direction to add a <ul> list menu of links to my footer. They need to display inline on desktop and then stack on mobile. Below is what I have so far, but nothing works. Also when I view the code in Chrome, each list item has a <p> tag with it? footer li { display: inline !important; list-style: none !important; } footer li a { color: #fff !important; font-size: 0.9rem; text-decoration: none !important; } footer li:after { content: " | "; } footer li:last-child { content: ""; } Much appreciaed!

Hi I am uing Fluid Egine to layout my pages. But it seems that for example if I add an image the a text block beeath that I can position it so in touches he botom of the image as it seems to snap to the grid size I have got. Finding myelf using loads of CSS to position elements precisely. Am I doing something wrong? Thanks

ahhhhhhh! Yes you were right their was some pesky CSS in custom code for all fluid images! Thanks

Hi Not sure if their is a setting in global I need to change but every image I add it creates a lot of paddig around it, it seems like it is snappng to the grid with the boundig box and not hugging the image. This is driving me crazy, please see screenshot. Is their anything that can be done about this? Thanks

Thanks.

Hi I am working o a new design for our Squarespace site - www.cn8.co.uk I have added a landing page, the client has just said that if someone goes to www.cn8.co.uk/about it says page not found as I had to disable these pages until the ew site has been built. Should I set up 302 redirects that takes them to the labding page, and can I revere these when I am ready to go live with the new site? Thanks

Also the footer block is far too tall, I cannot reduce the amount of rows below 5 for some reason, so I take it I have to do this with custom css? What would I need to add? Thanks again!

Thak, do yu see the page on this link? https://kumquat-lute-gky8.squarespace.com/home-1