• Resolved bhale7

    (@bhale7)


    Hey guys, I’m using an aweber opt-in form on my site and I have it going through a ‘Text’ widget. On my computer, it looks great in Chrome, okay in Mozilla, and bearable in IE.

    https://elitegamingcomputers.com

    However, a friend of mine sent me a picture of what it looks like in Safari, and the opt-in box is hanging outside of the widget. So, I’m not sure if it’s a different screen resolution that is bringing out the problem or what.

    Anyways, here is the code I am using in the ‘Text’ widget:

    <h1 style="font-size: 34px; font-family: fantasy; text-align:center; color: #CBFFCC; text-shadow: 8px 8px 28px #000000;"><b>Join Our Free Newsletter Today!</b></h1>
    <br>
    
    </br><p><h1 style="font-size: 22px; font-family: fantasy; text-align:center; color: #CBFFCC; text-shadow: 8px 8px 32px #000000; ">Enter your first name and your email address below to receive <b>Free Instant Access</b> to awesome gaming-computer-related content.</h1></p>
    <script type="text/javascript" src="https://forms.aweber.com/form/95/1337867795.js"></script>

    The opt-in box is just a square with the ‘Name’ and ‘Email’ fields as well as the ‘Submit’ button. The rest of the formatting inside the widget (the text/text-shadow) was done in the ‘Text’ box as seen above. And, the style of the widget itself was done through a child theme.

    I’m wondering if there is a better way to do it that will make sure that the aweber opt-in form doesn’t over extend the boundaries of the widget. I know I can just make the box smaller on aweber, but then it will look too small in the other browsers.

    Any ideas? Any help would be appreciated.

Viewing 3 replies - 1 through 3 (of 3 total)
  • This worked for me:

    #secondary #af-form-1337867795,
    #secondary #af-form-1337867795 .quirksMode {
         width: auto;
    }

    Just add it to your CSS file; it overrides a fixed pixel width in the original style sheet for the form.

    Thread Starter bhale7

    (@bhale7)

    Jerry, you’re a genius! That worked like a charm. Thank you for the help.

    Hi guys I’m using, RedLine 2.1.0 Theme by Yulian Yordanov, can someone tell me exactly where should I put this suggested code on the CSS file, must I put it in the beginning of the entire code, the end, the middle, or should I replace the side bar code?.

    My site is https://workfromhomechampions.com, the form is fine on IE, Chrome, but it looks terrible on Mozzila Firefox, it’s hanging outside.

    Thanks

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Aweber opt-in form — Is there a better way to do it?’ is closed to new replies.