Jump to content

Can't change the color of one text block in mobile! Is Fluid Engine the problem or me?

Go to solution Solved by creedon,

Recommended Posts

I don't know what I'm doing wrong unless I'm using 7.0 tactics to tackle a fluid engine problem? 

Just want the white text to be black! 

Why does this code not change the color? 

http://www.morsecreek.com

Site password: tara 

@media screen and (max-width: 640px)
{
#block-yui_3_17_2_1_1685124174773_3864 h2
  {color: black !important;}
}

 

Thank you for your help whoever you are! 

Screen Shot 2023-05-26 at 11.24.19 AM.png

Screen Shot 2023-05-26 at 11.24.46 AM.png

Edited by andreallevin
missing code
Link to comment
  • Replies 4
  • Created
  • Last Reply

Top Posters In This Topic

  • Solution

You needed to go one element deeper.

@media screen and ( max-width : 640px ) {

  #block-yui_3_17_2_1_1685124174773_3864 h2 span {
  
    color : black;
    
    }
    
  }

ScreenShot2023-05-26at12_53_29PM.png.1fb5538dcb2fe798ea4e37f67fd73ad4.png

Notice the class on the span element.

Let us know how it goes.

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment

omg. omg. 2 straight hours of troubleshooting. You saved me. My family thanks you.  But based on this new "span"  for the color it means I need seperate code to change the size correct? Or is there a better way to style the font all at once? Thank you again for your help.  

I

@media screen and ( max-width : 640px ) {

  #block-yui_3_17_2_1_1685124174773_3864 h2 {
  
    font-size : 50px !important;
    }
    
  }

Link to comment
Quote

But based on this new "span"  for the color it means I need seperate code to change the size correct?

Yes.

Quote

Or is there a better way to style the font all at once?

No.

Now to be fair one could possibly spend energy trying to figure something out to get it all in one ruleset but why spend the time for only a couple of lines of code.

If you are concerned about organization of the code just wrap the code in some comments to help you know what is going on.

/* begin my effect here */

  @media screen and ( max-width : 640px ) {
  
    #block-yui_3_17_2_1_1685124174773_3864 h2 span {
    
      color : black;
      
      }
      
    }
    
  @media screen and ( max-width : 640px ) {
  
    #block-yui_3_17_2_1_1685124174773_3864 h2 {
    
      font-size : 50px;
      
      }
      
    }
    
  /* end my effect here */

 

Find my contributions useful? Please like, upvote, mark my answer as the best ( solution ), and see my profile. Thanks for your support! I am a Squarespace ( and other technological things ) consultant open for new projects.

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • 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.