WordPress.org

Forums

Sweet Captcha
[resolved] Captcha Width (6 posts)

  1. swinston1000
    Member
    Posted 1 year ago #

    Hi

    I love you captcha - it is so well designed and so much fun.

    How do I change the width of it? I would like to reduce it to 280px.

    Thanks!

    Steven

    http://wordpress.org/plugins/sweetcaptcha-revolutionary-free-captcha-service/

  2. Sweet Captcha
    Member
    Plugin Contributor

    Posted 1 year ago #

    Hi Steven

    Sweet Captcha is optimal at 380px

    You can change it's width by adding custom CSS to your website, overriding the widget's default, i.e

    div.sweetcaptcha {
    min-width: 280px;
    width: 280px;
    }

    however please not Sweet Captcha might not function properly at this width, and you might need to do other CSS alterations in order to adjust it.

    More about customizing CSS could be found here
    http://en.support.wordpress.com/custom-design/editing-css/

  3. More about customizing CSS could be found here
    http://en.support.wordpress.com/custom-design/editing-css/

    Wrong link. That's for WordPress.COM blogs not self-hosted WordPress.ORG installation.

    Try one of these plugins if you just want to make minor CSS changes like that.

    http://wordpress.org/plugins/search.php?q=custom+CSS

  4. Sweet Captcha
    Member
    Plugin Contributor

    Posted 1 year ago #

    Thanks for the correction.
    This plugin may also be useful
    http://wordpress.org/plugins/simple-custom-css/

  5. Jargonsp
    Member
    Posted 9 months ago #

    Hello,

    I testing SwetCaptcha on my localhost and everything works fine except a small issue.

    On your own website the sweetcaptcha box has a certain height of 121px and the target graphic is aligned with the options pictures.

    In my situation the box is of a higher height and the target graphic (where you need to drag your selection) is misaligned and placed on a row above the options pictures. The box is the total box is higher.

    The problem is caused by this element (.wpcf7 p) that needs its "clear" value to be "0" instead of "both".

    *, *:before, *:after {
    box-sizing: border-box;
    }
    *, *:before, *:after {
    box-sizing: border-box;
    }
    div.sweetcaptcha p {
    direction: ltr;
    text-align: left;
    }
    div.sweetcaptcha p {
    color: #000;
    padding-bottom: 10px;
    }
    div.sweetcaptcha, div.sweetcaptcha * {
    font-family: arial,helvetica,sans-serif;
    font-size: 12px;
    line-height: normal;
    margin: 0;
    padding: 0;
    }
    .wpcf7 p {
    clear: both;
    height: auto;
    margin-bottom: 0;
    overflow: hidden;

    How can I target the .wpcf7 p through CSS? It seems that I am not using the appropriate selectors since I can make it work through firebug.

    Any input would be appreciated.

  6. Jargonsp
    Member
    Posted 9 months ago #

    Oops wrong thread! I am sorry, I will open a new one.

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags

No tags yet.