Mobile CSS issue

  • Resolved Beats247

    (@beats247)


    4 years, 1 month ago

    Hi there,
    your plugin is working fine but there is an CSS issue on mobile: https://prnt.sc/100vyam
    The comment date overlays the comment author’s name if the name is longer and doesn’t break the line. I have tried to fix it with a width settting and with overflow/word wrap but it doesn’t work properly. Could you please let me know how to fix that? Thanks!

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author gVectors Team

    (@gvectors-team)

    Hi @beats247,
    Could you please leave a URL to that page?

    Thread Starter Beats247

    (@beats247)

    Hi @gvectors-team,
    thanks for your reply. Yes, here’s the link: https://beats24-7.com/product/trapsoul-vocal-chops/

    Plugin Author gVectors Team

    (@gvectors-team)

    Hi @beats247,
    You should use a custom CSS code. Put this CSS code in the style.css of your current active them or use the top admin bar > customize > additional css > css code textarea. Save it, delete all caches and check the changes in a private/incognito tab of mobile browsers to avoid browser cache:

    @media only screen and (max-width: 800px) {
   #woopcomm .wpc-comment-author {
       width: 100%;
       float: none;
       white-space: normal;
   }
   #woopcomm .wpc-comment-date {
       font-size: 13px;
       float: none;
       text-align: left;
       line-height: 20px;
   }
}
    Thread Starter Beats247

    (@beats247)

    Hi @gvectors-team,
    that fixed it. Thank you!

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Mobile CSS issue’ is closed to new replies.