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!