HarryMeakin

password is 'bridgendathletics' I've managed to stop the clipping from another thread but still having issues with how this works on mobile too. Any help to tidy this up would be much appreciated

@brandon @tuanphan I'm having massive issues with this on mobile. When the caption is longer it reduces the size of the image instead of increasing the content area. Any thoughts? https://bridgendathletics.org/about password: bridgendathletics

Site URL: https://bridgendathletics.org/about

sorted! @font-face { font-family:'MonoSpec-SemiBold'; src: url(//static1.squarespace.com/static/6005a5e6e8c063189b6baf41/t/600ed9899dfc5a5337fa6773/1611585929994/monospec-semibold-webfont.eot), /* IE6-IE8 */ url(//static1.squarespace.com/static/6005a5e6e8c063189b6baf41/t/600ed586a2383a5eba79024d/1611584902142/monospec-semibold-webfont.woff2), /* Super Modern Browsers */ url(//static1.squarespace.com/static/6005a5e6e8c063189b6baf41/t/600ed5078b37961aa1911909/1611584775642/monospec-semibold-webfont.woff), /* Pretty Modern Browsers */ url(//static1.squarespace.com/static/6005a5e6e8c063189b6baf41/t/600ed8b4bf04aa2bc2d5e7bf/1611585716659/monospec-semibold-webfont.ttf); }

Site URL: https://bridgendathletics.org I have entered some code to allow my header bar to shink on scroll which works fine, however when you scroll back to the top of a page you get a flash of colour of nav at original size. Ideally the top nav bar should only be visible with transparent background. Not sure if this makes sense haha... quite hard to explain, if you scroll down on the page, then back up to top you should see it flash. password: bridgendathletics This is the code: header.shrink { .header-announcement-bar-wrapper{ padding-top: 20px!important; padding-bottom: 20px!important; background: transparent !important; } .header-title-logo a { max-height: 50px; content: url('https://static1.squarespace.com/static/6005a5e6e8c063189b6baf41/t/6005c7234f994d4e738961df/1610991400154/BAC_Logotype_White_type.png');

Site URL: https://goldfish-hyperboloid-b6rj.squarespace.com/home This is the code I am using for custom font, which is working fine on some browsers but is replaced by a serif on others. Please advise. password to site is: bridgendathletics @font-face { font-family: 'MonoSpec-SemiBold' !important; src: url(https://static1.squarespace.com/static/6005a5e6e8c063189b6baf41/t/600ed5078b37961aa1911909/1611584775642/monospec-semibold-webfont.woff); src: url(https://static1.squarespace.com/static/6005a5e6e8c063189b6baf41/t/600ed586a2383a5eba79024d/1611584902142/monospec-semibold-webfont.woff2); src: url(https://static1.squarespace.com/static/6005a5e6e8c063189b6baf41/t/600ed9899dfc5a5337fa6773/1611585929994/monospec-semibold-webfont.eot); src: url(https://static1.squarespace.com/static/6005a5e6e8c063189b6baf41/t/600ed8b4bf04aa2bc2d5e7bf/1611585716659/monospec-semibold-webfont.ttf) } h1 { font-family: 'MonoSpec-SemiBold'!important; } h3 { font-family: 'MonoSpec-SemiBold'!important; }

I'm having a similar problem – I have uploaded both font file types and still no luck on other browsers. https://goldfish-hyperboloid-b6rj.squarespace.com/home password: bridgendathletics