Search the Community

Hi all, wondering if there's some easy css I can add to all my clients sites so that the font weight doesn't increase like it appears to do in Firefox? Hasn't been a huge concern until this current site I'm working on where it removes all the subtle texture and feel I'm wanting from the heading fonts. It looks terrible in Firefox! Firefox also really seems to boost the saturation of all colours... if there was a fix to that too, so that my sites look identical across all browsers that would be wonderful. https://wisteria-flounder-azc3.squarespace.com/ LTvet2 is the pw

Site URL: http://www.gostmark.org/archive I'm trying to create an archive of our school newsletter emails. Mailchimp has produced a code: <style type="text/css"> <!-- .display_archive {font-family: arial,verdana; font-size: 12px;} .campaign {line-height: 125%; margin: 5px;} //--> </style> <script language="javascript" src="//gostmark.us19.list-manage.com/generate-js/?u=18d7f8073125d2ce90d3f0d24&fid=27220&show=10" type="text/javascript"></script> This works in every browser except Firefox. Mailchimp said it's related to a conflict between the code, the site, and Firefox but couldn't offer me any further help. Anyone have an idea? Page location is gostmark.org/archive Thanks!

Site URL: https://mouse-trout-epjy.squarespace.com/ I have a custom button which is displaying fine in Safari & Chrome, but incorrectly on Firefox. I am trying to use @supports (-moz-appearance) but getting nowhere. First screenshot shows how it should be, with the arrow nicely padded: Second screenshot shows what Firefox displays, arrow sitting behind text & not padded: And here's my code: .sqs-block-button-element--small.sqs-block-button-element { font-family: 'Effra'; font-weight: bold; font-size: 44px; white-space: nowrap; background-color: transparent !important; background-image: url("//static1.squarespace.com/static/5f3690f6995b741710ab4824/t/5f58e97c7a515e6376f127c3/1599662460713/arrow.png"); background-repeat: no-repeat; background-position: 90% 50%; background-size: 30%; padding-right: 5%; transition: all 0.3s ease 0s; } //fix button display issues on firefox// @supports (-moz-appearance) { .sqs-block-button-element--small.sqs-block-button-element { font-family: 'Effra'; font-weight: bold; font-size: 44px; white-space: nowrap; background-color: transparent !important; background-image: url("//static1.squarespace.com/static/5f3690f6995b741710ab4824/t/5f58e97c7a515e6376f127c3/1599662460713/arrow.png"); background-repeat:no-repeat; //this is the bit to be changed for FF// background-position: 10% 10%; background-size: 10%; transition: all 0.3s ease 0s; } } Does Squarespace not allow moz supports queries or am I just not targeting the element correctly?

Hello! I use a large Heading 1 and a smaller Heading 4 on my site and they look great on Firefox, but on Chrome and Safari all of the heading styles appear as the same size. Is there any fix for this? Thanks!

Site URL: https://melina-clark-jeweller.squarespace.com Anyone else having this issue on product pages in 7.1 - where there is an alternate image the product fades to white when hovered over and before clicking through to the actual product - very disconcerting. I am using Firefox and know it works as it should on Chrome, so should not be a case of requireing any CSS to have that function. I also don't want to have to go down the route of purchasing a plugin when this function should work seamlessly and natively. I can't believe I'm the only one - I have two websites lined up to launch in the next week and obviously can't do this if the action is not functioning properly on Firefox - a major browser! I have reported this to Squarespace and they have it with the engineers but no resolution yet. Password is unboundedsway.

Site URL: https://mouse-trout-epjy.squarespace.com/members Hello, I have customised my buttons using CSS but they are much smaller in Firefox than Chrome & Safari. Is there a reason for this - and how can I fix it? Safari & Chrome: Firefox: site password: spong123

I am not a web design person or programer, so what I am asking is not in my wheelhouse. Any help would be appreciated. My customers are not tech savvy and quite often I have to have them download a file from my website. The hardest and longest part of the process with my customer is getting the file download and installed on my customer's computer. I created a page with a clickable link to the file. Is there a way to have an animation or image of an arrow that points to the downloaded file in my end user's browser once they click the link to download the file? Safari's download list is an icon at the top right of the Safari window, Chrome's is at the lower left of the Chrome window, etc. I have seen other sites that visually show the user where the download goes once they click the link (I can not think of a site that does this right now).

Site URL: https://diversitymattersbyrudy.squarespace.com/resources Hi - I'm having issues with my anchor links not working in Firefox. I can't seem to find a fix anywhere. Works great in Chrome. Any ideas? Thanks!

Site URL: https://pelican-chiton-xwy4.squarespace.com/shop Hello, There seems to be an issue with Firefox not showing my Product's hover states (image is not showing on hover). Is there any way I could disable hover states for Firefox only? Thanks, Xavier

Site URL: https://pelican-chiton-xwy4.squarespace.com/shop/fos-classic Hello, I'd like to use a sans-serif font on my PDP dropdown but Firefox seems to be using a serif typeface by default (see attached). Is there any chance I could change that? Thanks

Site URL: https://www.mattportch.com/ Hi does anyone know why logos look bad (blurry, pixellated) in Firefox browser?

Site URL: https://www.mattportch.com/ Hi, Does anyone know how to remove these weird dotted boxes when selecting anything in Chrome or Firefox? This doesn't happen in Safari...

I set up my clickthrough in an image block to an uploaded pdf file. It works in Internet Explorer, Google Chrome and Microsoft Edge. In Firefox, the URL appears at the bottom left when I click the image, but the document doesn't open. How can I get it to work in Firefox?

Hi all! I am having some CSS issues with Firefox. The page header on some of my pages seems to not load properly. I've tried to "Inspect" it on Firefox, but when I do, it fixes the problem. It looks to be the top padding. Specifically on this page and only in Firefox:https://plum-cymbals-f7jd.squarespace.com/community-relations PW: cnAnd yes, Ajax is already disabled. :) Is there a way to target only Firefox browsers or another way to write the code?

The images on the slide carousel in Ishimoto are spaced irregularly when viewed in Firefox. In Chrome, all is as should be. I can confirm that this oddity has nothing to do with my style tweaks as this happens to the default Ishimoto demo as well. Can anything be done about this? I found a similar question back in 2012 on here that was closed because the bug was fixed.www.eyeofmedusa.com/inspired-by Thank you!

For some reason, our landing page has blurry images when pulled up in internet explorer and firefox. The images show up fine on Google Chrome and Microsoft edge. In Internet explorer and Firefox the rest of the images show up fine on the rest of our pages, it is just our landing page in a gallery wheel. When saving the images from each browser it is showing that the images are smaller pixel sizes. It seems like IE and Firefox are shrinking the images down and then blowing them up making them blurry. What should I do to make these images clear again?