CSS formatting on Quiz

  • Resolved OPunWide

    (@opunwide)


    4 years, 9 months ago

    I’ve created a new form and everything works except the quiz formatting. The quiz question is to the right of input box, which is floated left. The text is grayed out and in a smaller font; it looks somewhat like an acceptance field.

    This is a new form, so I don’t have a previous version to compare it to.

    As a possible hint, I did notice that although the span has a class of “wpcf7-quiz-label”, there isn’t any related CSS for that class. The main style seems to be “.wpcf7 p span”.

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Author Takayuki Miyoshi

    (@takayukister)

    Where can we see the website?

    Thread Starter OPunWide

    (@opunwide)

    https://hcovc.org/temp-application/

    Use password: temppw

    Plugin Author Takayuki Miyoshi

    (@takayukister)

    What other plugins and theme do you use on the site?

    Thread Starter OPunWide

    (@opunwide)

    I’m using the Hueman theme (https://presscustomizr.com/hueman/), with a couple of mods from very simple child theme I added. Hueman is not 100% up to date, but close.

    I duplicated the problem with all plugins disabled. Unfortunately it’s a live site, so I can’t leave it that way for you. CTRL-F5 after they were disabled.

    Thanks for your quick responses.

    Thread Starter OPunWide

    (@opunwide)

    Same problem Chrome and Firefox.

    Comparing some of the input sections… The main differences on the quiz are:
    – The label text is wrapped by a span (with class wpcf7-quiz-label). This is causing the smaller font and lighter text.
    – The other label text is not wrapped by a span. But they do have a <br> after them which the quiz label does not have.

    Thread Starter OPunWide

    (@opunwide)

    I gave up and added some CSS to fix this. Hopefully it won’t cause any future problems.

    Essentially I added { font-weight: 600; color: #444; display: block; } to the “wpcf7-quiz-label” class.

    Because of that, the https://hcovc.org/temp-application/ page won’t show the problem without disabling that CSS.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘CSS formatting on Quiz’ is closed to new replies.