Home>Support>Does “customize menu” interfere on the CSS ?

Does “customize menu” interfere on the CSS ?

Hi,

i want to make an animate transition on links with CSS:

liensaccueil a{
font-family:'citation';
color:#000;
font-weight:normal;
font-size:23px;
-webkit-transition:all 0.8s ease;
-moz-transition:all 0.8s ease;
-o-transition:all 0.8s ease;
transition:all 0.8s ease;
text-decoration:none;
letter-spacing:1px;
}
liensaccueil a:hover {
color:#777;
text-decoration:none;
}

Before, i customize color of the links with the “customize menu”,

Does it interfere with CSS

Thanks for Help

URL: http://caletre.fr/expertisecomptable/

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 8 years, 11 months ago Andrew Misplon
    Hi, I Work Here

    Hi Jehannehya

    Thanks for reaching out.

    The Customizer works by outputting CSS into the document head. It doesn’t change the theme’s base style.css file.

    Your Custom CSS could be inserted at Appearance > Custom CSS.

    What is:

    liensaccueil
    

    Is that a class or ID? If so, it needs a period in front of it for a class or a hash in front of it for an ID.

    This might also work:

    .entry-content a{
    font-family:'citation';
    color:#000;
    font-weight:normal;
    font-size:23px;
    -webkit-transition:all 0.8s ease;
    -moz-transition:all 0.8s ease;
    -o-transition:all 0.8s ease;
    transition:all 0.8s ease;
    text-decoration:none;
    letter-spacing:1px;
    }
    .entry-content a:hover {
    color:#777;
    text-decoration:none;
    }
    
  2. 8 years, 11 months ago jehannehya

    Thanks !

    I need a class to make a different type design on home page :

    For example I wrote this

    .liensoffre a{
      text-decoration:none;
    color:#000;
    
    
    }
    .liensoffre{
    font-family: 'ligne'; 
      font-size: 30px; 
      letter-spacing: 3px; 
      line-height: 35px; 
      text-transform: uppercase;
      text-decoration:none;
      -webkit-transition:all 0.8s ease;
    -moz-transition:all 0.8s ease;
    -o-transition:all 0.8s ease;
    transition:all 0.8s ease;
    
    }
    .liensoffre a:hover{
    font-family: 'ligne'; 
      font-size: 30px; 
      letter-spacing: 3px; 
      line-height: 35px; 
      text-transform: uppercase;
      text-decoration:none;
      color:#888;
        
    }
    

    and if you look at the Home page http://caletre.fr/#offre you could see the title “depuis l’international avec nous”,
    the hover effect don’t work at all,

    i put the class on the raw attribute

    Something after in the code stop the instruction ?

  3. 8 years, 11 months ago Andrew Misplon
    Hi, I Work Here

    You’ve placed your class in the a element. It’s in the link. So you need to rather say the following:

    .entry-content a.liensoffre {
      text-decoration:none;
    color:#000;
    }
    
    .entry-content a.liensoffre:hover{
    font-family: 'ligne'; 
      font-size: 30px; 
      letter-spacing: 3px; 
      line-height: 35px; 
      text-transform: uppercase;
      text-decoration:none;
      color:#888;
    }
    

    Hope that helps.

  4. 8 years, 11 months ago jehannehya

    Thanks,

    helpful, and make understand something about CSS.

    thank a lot !

  5. 8 years, 11 months ago Andrew Misplon
    Hi, I Work Here

    For sure :) Glad that did the trick.

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More