Unable to vote

  • Resolved bufus

    (@bufus)


    4 years, 8 months ago

    I apologize beforehand for the eventual multiple posts, but I’ll try to state issues individually for better understanding and less cluttering.

    The rating stars above the comment box look fine on desktop view, but when I switch to mobile view (either tablet or smartphone size), they show like this -> https://imgur.com/628t55J
    Also, I don’t know if it’s related, but to vote on full 5 stars it’s necessary to click a bit to the right of the last star. Clicking directly on the star will only mark 4.5.

    Is there anything that can be done to correct the layout?
    My site is currently closed, so I can’t provide a link, but I can post the pertinent code if needed.

Viewing 7 replies - 1 through 7 (of 7 total)
  • Thread Starter bufus

    (@bufus)

    Darn, wrong title, and I just noticed now… I named the thread according to a previous issue that I managed to correct, please disregard the title :/

    Plugin Contributor contactashish13

    (@rozroz)

    @bufus the behavior of the stars is fine. You have to click a bit to the right of the last star. For your other issue, which theme are you trying with? Can you please try with the default WP themes and let us know what you find?

    Thread Starter bufus

    (@bufus)

    I’m using Astra, but here’s a screenshot of the stars with the Twenty Twenty theme, same issue -> https://imgur.com/lkieMzr
    Twenty Seventeen and Twenty Nineteen do the same, but Twenty Sixteen deforms the table differently -> https://imgur.com/ZLJdWOw

    • This reply was modified 4 years, 8 months ago by bufus.
    Thread Starter bufus

    (@bufus)

    As further information, I also tested with Twenty Fourteen and the problem is the same.
    Meanwhile I deactivated all plugins (except Akismet, Jetpack and Pods), and the display remains the same…
    I hope some CSSA workaround is possible…

    Thread Starter bufus

    (@bufus)

    I apologize for the spam.
    I tested some CSS through the customizer’s “Additional CSS” and came up with this:

    #wppr-comment-rating-stars div {
	display:table-row;
}
.wppr-comment-form-meta div{
	display:table-cell;
}
.wppr-comment-form-meta label{
	display:table-cell;
}

    The above CSS will make the stars show like this: https://imgur.com/FxKktbJ

    The code below will make the stars show like this: https://imgur.com/KUyFYk6

    #wppr-comment-rating-stars div {
	display:table-row-group;
}
.wppr-comment-form-meta div{
	display:table-row;
}
.wppr-comment-form-meta label{
	display:table-row;
}

    None of the above solutions feel like the proper way to do it, though…

    • This reply was modified 4 years, 8 months ago by bufus.
    Plugin Contributor contactashish13

    (@rozroz)

    @bufus if it works for you, then that’s the best way to do it! Thanks for letting us know.

    Plugin Contributor contactashish13

    (@rozroz)

    If you are satisfied with our product and support, kindly spare a moment to leave us a review. It would really help us spread the word!

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Unable to vote’ is closed to new replies.