Better way to exclude html elements from css

• 

  cbdoilusa · Member · Aug 3, 2017 at 8:48 pm

  • Copy link
  • Add topic to favorites

  I have found a really nice css code that will show links as highlighted text. Now I would like to have this style applied only on posts on my website so after adding the css style I needed to exclude other elements that will not fit into my post requirement so I ended up with this:

  .entry-content p a:not(.et_pb_more_button):not(.et-pb-arrow-prev):not(.et-pb-arrow-next):not(.jp-relatedposts-post-title):not(.jp-relatedposts-post-a):not(#footnote_reference_container_collapse_button):not(.et_pb_text_inner){
    text-decoration:none;
    border-bottom: 2px solid #bdef7a;
    box-shadow: inset 0 -4px 0 #bdef7a;
    color: inherit;
    transition: background 0.1s cubic-bezier(.33,.66,.66,1);
  }
  
  .entry-content p a:hover:not(.et_pb_more_button):not(.et-pb-arrow-prev):not(.et-pb-arrow-next):not(.jp-relatedposts-post-title):not(.jp-relatedposts-post-a):not(#footnote_reference_container_collapse_button):not(.et_pb_text_inner){
    background: #bdef7a;
  }

  Is there a more elegant solution to this problem not to mention that on the homepage, in the footer area there are links underlined with the green style I have just applied even if I did exclude their class by adding :not(.et_pb_text_inner)

  The blog I need help with is: (visible only to logged in users)

• 

  garysixtyeight · Member · Aug 3, 2017 at 8:57 pm

  • Copy link

  Hi there,

  It looks like you’re using the premium Divi theme on a self-hosted WordPress site.

  If you need support for customizing Divi, please try contacting Elegant Themes support at:
  https://www.elegantthemes.com/forum/

  The forum you’ve posted this thread in only provides support for sites hosted here at WordPress.com. As your site is not hosted here, we are unable to support it.

  To learn about the differences between the two versions of WordPress (.com vs.org), please see this guide.

  Good luck!