PLEASE NOTE: These forums are no longer utilized and are provided as an archive for informational purposes only. All support issues will be handled via email using our support ticket system. For more detailed information on this change, please see this blog post.

Formatting Problem with Theme

  1. wd3244
    Member

    I have a form that I'm trying to use with Optimize press theme but, the forms looks pretty bad.

    It's has bullets, which I don't want and the fields are on one row. I would like to have two column so that fields like First & Last name are next to each other from left to right.

    Here's what it looks like now.
    http://media.instantcustomer.com/18073/0/17_testform.jpg

    This is what I would like it to look like.
    http://media.instantcustomer.com/18073/0/16_freedomsoft.jpg

    I have no idea how to fix this. Any help will greatly appreciated.

    Thank you,
    Will

    Posted 13 years ago on Thursday May 10, 2012 | Permalink
  2. Will, first of all are you outputting our CSS in the plugin settings? If not, do that first.

    Second, here is a FAQ to get rid of the bullets (unless you weren't outputting our CSS):
    http://www.gravityhelp.com/question/why-is-my-form-showing-up-with-list-bullets/

    Third, when you output our CSS you can use our ready classes for the columning, inline, etc:
    http://www.gravityhelp.com/documentation/page/CSS_Ready_Classes

    Let me know how it goes.

    Posted 13 years ago on Thursday May 10, 2012 | Permalink
  3. wd3244
    Member

    Rob,
    That was it, CSS was not enable...Thank you SO much!

    I have another question. Is it possible to 'center justify' the submit button. It currently looks like this:
    NOTE: submit button is label 'yes, let me in now'
    http://chicagohandymanspecials.com/wp-content/uploads/2012/05/Chicago-Handyman-Specials-Thank-You-Chicago-Handyman-Specials.jpg

    But I want it center on the page.

    Thanks again for your help.
    Will

    Posted 13 years ago on Friday May 11, 2012 | Permalink
  4. Sure thing, I can help you out with that. Can you post a link to the form in question?

    Posted 13 years ago on Friday May 11, 2012 | Permalink
  5. wd3244
    Member

    Dude! Your support is sick! I've never had this type of service before on anything I've bought online. Just awesome!

    O.K. enough about you. :-)) . The first link below is my current non-gravity form (it's Aweber), which has the formatting I need. It's all nice and centered including the submit button. The second page is using gravity forms but, the submit button is not center.

    1. http://chicagohandymanspecials.com/thankyou
    2. http://chicagohandymanspecials.com/thankyou1

    Thanks Rob,
    Will

    Posted 13 years ago on Saturday May 12, 2012 | Permalink
  6. Hey Will, thanks for the kind words. I'm glad to help out man! So this snippet will target the submit button on every form:

    [css]
    .gform_wrapper .gform_footer {
    text-align: center;
    }

    However, if you want to target just this form you could use:

    [css]
    #gform_wrapper_2 .gform_footer {
    text-align: center;
    }

    You'll want to place either one you decide on into your theme's stylesheet and you should be good to go!

    Posted 13 years ago on Sunday May 13, 2012 | Permalink
  7. wd3244
    Member

    The theme that I'm using has a custom CSS option where I can put my own code....So I tried using the one you gave me and I'm still getting the same results.

    I'm wondering if there is more coding I need to place here to get this option to work. Below is a screen option of the section where I can place custom codes for the theme.

    http://chicagohandymanspecials.com/wp-content/uploads/2012/05/css-for-theme.jpg

    If I have to add your code in the actually Theme's style page where in that file does this code need to go?

    Below is the Theme's full Style.css code in case you need it.
    ===================================================================================
    /*
    Theme Name: OptimizePress
    Theme URI: http://optimizepress.com/
    Description: OptimizePress is the essential theme for marketers. Create squeeze pages, sales letters and much more with ease.
    Version: 1.45
    Author: OptimizePress & James Dyson

    */
    @charset "UTF-8";

    /* CSS Document */

    body{
    background: #efefef;
    background-repeat:repeat-x;
    margin-top: 0px;
    margin-right: 0px;
    margin-left: 0px;
    margin-bottom: 0px;
    font: 0.75em/160% Helvetica, Arial, Verdana, sans-serif;
    color:#000000;
    }

    .aclear{clear:both;}
    /*New Share Bar */

    #sharebarnew{width:797px;height:89px;margin:0px auto;padding-top:4px;}

    #sharebarnew2{width:600px;height:89px;margin:0px auto;padding-top:4px;}

    #sharebarnew-left{width:110px;height:89px;background-image:url(images/share/sharebar-left.png);float:left;}

    #sharebarnew-text{width:395px;height:89px;float:left;}

    #sharebarnew-fb{width:72px;height:89px;float:left;}

    #sharebarnew-twitter{width:73px;height:89px;float:left;padding-right:20px;}

    #sharebarnew-right{width:126px;height:89px;float:left;background-image:url(images/share/sharebar-right.png);}

    #wrapper{width:977px;margin:0px auto;}

    #launchheader{width:977px;height:30px;line-height:0;}

    #launchheaderbottom{width:977px;height:47px;background-image:url(images/launch4header.png);}

    #headlinesection{padding-bottom:12px;}

    #launchfooter{width:977px;height:51px;background-image:url(images/launch4footer.png);}

    #launchbk{background-image:url(images/launch4bk.png);background-repeat:repeat-y;padding-top:10px;}

    #launchinnertop{padding-left:60px;padding-right:60px;width:850px;margin:0px auto;padding-bottom:10px;}

    #launchinnermain{padding-right:20px;width:800px;margin:0px auto;padding-bottom:15px;padding-left:0px;}

    #launchbk p{margin-top:0px;font-size:15px;line-height:22px;}

    #launchbk h2{margin-top:0px;font-size:1.9em;line-height:1.9em;color:#222222;letter-spacing:-0.04em;font-weight:normal;margin-bottom:5px;}

    #launch1left{width:800px;padding-left:60px;padding-right:10px;float:left;}

    #launchcommentsblock li{list-style:none;font-family:helvetica,arial,sans-serif;font-size:13px;color:#5c5c5c;min-height:130px;border-bottom:1px solid #e4e4e4;padding-bottom:10px;padding-top:15px;}

    #launchcommentsblock li:first-child{border-top:1px solid #e4e4e4;}

    #launchcommentsblock li:last-child{border-bottom:0px;}

    #launchcommentsblock li p{font-family:helvetica,arial,sans-serif;font-size:13px;color:#5c5c5c;line-height:21px;}

    #launchcommentsblock ol{padding-left:0px;margin-left:0px;}

    #launchcommentsblock img{border:3px solid #e4e4e4;}

    .launchcommentspic{float:left;width:110px;height:100px;font-size:12px;color:#929292;}

    #launchcommentsblock textarea{width:580px;border:1px solid #c7c7c7;padding:5px;font-size:13px;color:#494949;}

    #launchcommentsblock input{}

    .launchcommentspic a{color:#636363;text-decoration:none;}

    .inputcomments{color:#494949;border:1px solid #c7c7c7;padding:5px;font-size:13px;}

    .commentswidth { width:500px; }

    .commenttitle{float:left;width:500px;}

    #headertext{
    position:relative !important;
    top: 55px !important;
    }

    ==================================================================================

    P.S. I'm so close in getting this form to the finish line thank to you.

    Thanks,
    Will

    Posted 13 years ago on Monday May 14, 2012 | Permalink
  8. Will, in your screen shot I don't see the # in front of the selector that I provided above. The # is for elements that have IDs and the . is for elements who have classes. It looks like you opted for the ID version and that requires the # in front of the selector.

    Posted 13 years ago on Monday May 14, 2012 | Permalink
  9. wd3244
    Member

    That was it! Take a look.

    http://chicagohandymanspecials.com/wp-content/uploads/2012/05/css-fixed-submit-button-centering-issue.jpg

    Thank you so much...You help me meet my deadline to get this form in production this week.

    Thanks,
    Will

    Posted 13 years ago on Monday May 14, 2012 | Permalink
  10. Awesome Will. Glad to help out!

    Posted 13 years ago on Monday May 14, 2012 | Permalink

This topic has been resolved and has been closed to new replies.