title: css not applying in wordpress divi theme button module settings, advanced tab
body: <p>CSS code not applying in Divi Theme, button module settings, advanced tab.</p>
  
  <p>I'm trying to add css code to the advanced tab of a button module on my homepage. www.LumiWave.com, bottom of page. The button is labeled "explore products"</p>
  
  <p>Currently Running
  WordPress 4.7.6
  Divi 3.0.72 by Elegant Themes</p>
  
  <p>Here is what I'm doing:
  From the button module, I'm clicking settings.
  From there I click the Advanced tab.
  At the top, in the "CSS Class:" field I input "greenbutton" as the class name. 
  Then I scroll down to the "Main Element:" section and paste in the following: </p>
  
  <pre><code>.greenbutton:link {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    width: 253.188px;
    height: 51px;
    position: relative;
    cursor: pointer;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    padding: 12px;
    border: 1px solid rgba(255,255,255,0);
    -webkit-border-radius: 8px;
    border-radius: 8px;
    font: normal normal bold 14px/25.5px “Roboto”, sans-serif;
    color: rgb(255, 255, 255);
    text-align: center;
    text-transform: uppercase;
    -o-text-overflow: clip;
    text-overflow: clip;
    letter-spacing: 0.3px;
    background: #78b657;
    -webkit-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    -moz-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    -o-transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
    transition: all 0.2s cubic-bezier(0.25, 0.1, 0.25, 1);
  }
  
  .greenbutton:hover {
    border: 1px solid #78b657;
    color: #78b657;
    background: rgba(124, 218, 36, 0.2);
  }
  </code></pre>
  
  <p>It doesn't apply the style sheet settings, instead in continues to grab the settings from the main button style settings area. </p>
  
  <p>From wordpress admin, if I customize the Divi theme by going to appearance -> customize -> buttons -> button style or button hover style, that is where it is still grabbing its settings from. </p>
  
  <p>I know that I can configure this from design tab if I want to and I may end up having to do that if I can't get this to work, but the advanced CSS tab is supposed to work and I wanted to play around with a few advanced settings that I can't get from the design tab alone. </p>
  
  <p>The settings all work as expected on css tool sites, I'm thinking it has something to do with the way I'm entering or defining the class name, but from all the references I could find it looks correct. </p>