Questions css styles changed after 4.0.0 update

  • Resolved wallyO

    (@wallyo)


    8 years, 9 months ago

    The html structure of the accordion changed with this update.
    Previously the structure was…

    <div  class="accordion ui-accordion ui-widget ui-helper-reset">
  <h3 class="ui-accordion-header ui-state-default ui-corner-all ui-accordion-icons">
    <a href="">FAQ Question</a>
  </h3>
  <div class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom">
    <p>FAQ Answer</p>
  </div>
</div>

    And css styles for the FAQ Question was applied with the classes…
    .ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited{...}
    After the update the html structure is…

    <div class="accordion ui-accordion ui-widget ui-helper-reset">
  <h3 class="ui-accordion-header ui-state-default ui-corner-all ui-accordion-icons">FAQ Question</h3>
  <div class="ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom">
    <p>FAQ Answer.</p>
  </div>
</div>

    So any custom css you have added to style the Questions should be referenced with the css selectors…

    .ui-accordion .ui-accordion-header h3 {
    font-family: Arial;
}

    https://www.ads-software.com/plugins/wp-awesome-faq/

Viewing 4 replies - 1 through 4 (of 4 total)
  • Thread Starter wallyO

    (@wallyo)

    Resolved.
    See above post.

    Plugin Author Liton Arefin

    (@litonice13)

    Hello wallyO,
    Thanks a lot with the Details Answers. You’ve done a lot for me to answer this Question. I think I have to update with remove those CSS from files in case of Changing clients websites.
    Thanks again

    Thread Starter wallyO

    (@wallyo)

    Hello Liton,
    None of the jquery-ui css is causing problems.
    My problem was with a custom css style I had added to decrease the font size when the html structure was h3 a.
    Once the html structure changed to just h3 that style was no longer applied.

    photosbyemilie had a different problem. Her theme had a css declaration…

    .article-content h3 {
    font-family: prophecy_scriptregular,Courier,monospace;
}

    which was not applied to the accordion Questions before the update, but once the accordion question html structure changed to h3 it did apply. She would need to add a css declaration to one of her style sheets to override it, like this…

    .ui-accordion .ui-accordion-header h3 {
    font-family: Arial;
}

    Plugin Author Liton Arefin

    (@litonice13)

    Hello wally0,
    In just short of time I’ve given your answers that you’ve really done a lot for me with the explanations.
    Yes, I’ve changed the HTML declarations. Because there no need a tag at all.
    It may cause CSS Issue on some themes. If I get few more problems with Themes then I will add custom CSS options or on “WP Awesome FAQ” Plugin CSS properties will be override with !important.

    Again Thanks a lot for your nice and descriptive answers.
    Thanks

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Questions css styles changed after 4.0.0 update’ is closed to new replies.