Jump to content

Custom CSS not working at all

Recommended Posts

Hello, hoping someone is able to help?

I'm a complete beginner to CSS, however I have been trying to pick up the basics via online tutorials.

However, when I input even the most simple of commands, like changing the colour of a heading nothing happens? Is there anything I'm doing wrong?

Many thanks!

Link to comment
  • Replies 5
  • Created
  • Last Reply

Thank you so much for responding!

My website is embracekeratin.com , and I inputed the below code to the custom CSS section but absolutely nothing happened:

a {
  color: red;
h1 {
  colour: red;


I've also tried some other CSS copied and pasted in and it doesn't seem to alter anything?

Screenshot 2019-12-31 at 22.28.22.png

Link to comment

For the <a> another style is using a rule that is more important than what you are writing, in this case you need to add ! important after the color code, which makes it stronger and ignores all the subsequent rules. 

For the <h1> there's a typo - in color code you should write color without 'u'.

However, I recommend you changing your header colors using the native tools instead. Go to Design > Style and change your main colors there 😉 

  color: red!important;

  color: red;


Link to comment

Amazing- thank you so much! 

The colours was just a test to see if it worked as the original code I pasted in wasn't working. I'm actually trying to get the below code to hide the banner on a mobile device. Would you have any idea why this isn't working?


@mobile:          ~"only screen and (max-width: 640px)";
@tablet:   ~"only screen and (min-width: 641px) and (max-width: 949px)";

@media @tablet {
/* Insert Code for Tablet Below This Line*/

/* Insert Code for Tablet Above This Line */

@media @mobile {
/* Insert Code for Mobile Below This Line*/
  #home img {
display: none;

#home .sqs-block-image img {
display: block;

#home {
background: url('https://static1.squarespace.com/static/5d8bbd6cd46259208da1c786/t/5e0ba5f9bb6d5e7d7049d49b/1577821699741/Mobile+Banner.pnghttps://static1.squarespace.com/static/5d8bbd6cd46259208da1c786/t/5e0ba5f9bb6d5e7d7049d49b/1577821699741/Mobile+Banner.pnghttps://static1.squarespace.com/static/5d8bbd6cd46259208da1c786/t/5e0ba5f9bb6d5e7d7049d49b/1577821699741/Mobile+Banner.pnghttps://static1.squarespace.com/static/5d8bbd6cd46259208da1c786/t/5e0ba5f9bb6d5e7d7049d49b/1577821699741/Mobile+Banner.png');
background-repeat: no-repeat;
background-size: 100%;

/* Insert Code for Mobile Above This Line */

Link to comment


This topic is now archived and is closed to further replies.

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.