Custom Code not showing on Microsoft Edge - Using 7.1 template

Hello there, 

I am using the 7.1 template and used the following code to change the logo on specific pages. 

Quote

 

/**desktop logo**/

@media screen and (min-width:767px) {

 .header-title-logo img {

content: url("//static1.squarespace.com/static/5ebeb3beb8891c6346025774/t/5ec80300da110857005a2648/1590166272722/SpartanLogo_Horizontal_WEB-01.png")

  !important;

max-height:inherit !important;

 

  }

}

 

Everything works great however, it does not show on Microsoft Edge Internet platform. Any thoughts on why?

Thank you!

Quote

The content property is only valid on :before and :after pseudo-elements

You can use CSS background image, or CSS :after :before to insert new image.

(I think I wrote this code, will search again tonight)

@tuanphan I would so appreciate you looking into that. Thank you!

Try this code

@media screen and (max-width:767px) {
.header-title-logo img {
    visibility: hidden;
}
.header-title-logo a {
    background-image: url(https://beaverhero.com/wp-content/uploads/2019/07/coffee-beans-1082116_640-min.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}
}

On 5/29/2020 at 12:26 AM, BCreative said:

Hello there, 

I am using the 7.1 template and used the following code to change the logo on specific pages. 

Everything works great however, it does not show on Microsoft Edge Internet platform. Any thoughts on why?

 

Thank you!

Were you ever able to fix this for Edge? I have a similar custom code not working on Microsoft Edge. Wanted to change the logo depending on the section background color being used (Squarespace 7.1) Would appreciate any tips if you got it fixed for this one browser!