This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

Does “customize menu” interfere on the CSS ?

Resolved 5 replies premiumthemetheme-vantage
10 years ago · Last reply by Andrew Misplon 10 years ago

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.

Need fast email support? Get SiteOrigin Premium

Replies

5
  1. Andrew Misplon Staff 10 years, 4 months ago

    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. jehannehya 10 years, 4 months ago

    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. Andrew Misplon Staff 10 years, 4 months ago

    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. jehannehya 10 years, 4 months ago

    Thanks,

    helpful, and make understand something about CSS.

    thank a lot !

  5. Andrew Misplon Staff 10 years, 4 months ago

    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.

Have a different question or issue?

Start New Thread