Title: Moving Submit Button Inline
Last modified: August 22, 2016

---

# Moving Submit Button Inline

 *  Resolved [CaliforniaSea](https://wordpress.org/support/users/californiasea/)
 * (@californiasea)
 * [11 years, 3 months ago](https://wordpress.org/support/topic/moving-submit-button-inline/)
 * I created a form with one “text” input field and would like to move the submit
   button adjacent and inline with the field. Any hints on this?
 * Here is the form code I am using:
 *     ```
       [text* your-name placeholder "You Name"]
   
       [submit  class:button_submit "Submit"]
       ```
   
 * I tried the following CSS but to no avail:
 *     ```
       .wpcf7 {
       float:center; /*Center form on page*/
       text-align:center;
       display:inline;
       }
       ```
   
 * [https://wordpress.org/plugins/contact-form-7/](https://wordpress.org/plugins/contact-form-7/)

Viewing 4 replies - 1 through 4 (of 4 total)

 *  [p.castaldi](https://wordpress.org/support/users/pcastaldi/)
 * (@pcastaldi)
 * [11 years, 3 months ago](https://wordpress.org/support/topic/moving-submit-button-inline/#post-5847969)
 * do like this:
 *     ```
       <ul class="floatLi selfClearCont">
       <li><fieldset>[text* your-name placeholder "You Name"]<fieldset></li>
       <li>[submit  class:button_submit "Submit"]</li>
       </ul>
       ```
   
 * and
 *     ```
       ul.floatLi li {float: left; margin-right: 10px;}
         ul.floatLi li:last-of-type {margin-right: 0px; clear: right;}
   
         ul.selfClearCont {
           padding: 0 !important;
           margin: 0 !important;
         }
   
         ul.selfClearCont li {
           list-style-type: none;
           padding: 0 0 10px 0 !important;
         }
         .selfClearCont:before,
         .selfClearCont:after {
           content:"";
           display:table;
         }
   
         .selfClearCont:after {
           clear:both;
         }
   
         .selfClearCont {
           zoom:1; /* For IE 6/7 (trigger hasLayout) */
         }
       ```
   
 * This should help
 *  Thread Starter [CaliforniaSea](https://wordpress.org/support/users/californiasea/)
 * (@californiasea)
 * [11 years, 3 months ago](https://wordpress.org/support/topic/moving-submit-button-inline/#post-5847983)
 * That does indeed put them inline, but unfortunately it floats the object to the
   left.
 * If float:left; is replaced with float:center; it makes them out of line again.
 *  [p.castaldi](https://wordpress.org/support/users/pcastaldi/)
 * (@pcastaldi)
 * [11 years, 3 months ago](https://wordpress.org/support/topic/moving-submit-button-inline/#post-5848000)
 * Sorry, I did not understand you wanted centered items. You can’t use float: center(
   it doesn’t exist). You have to do:
 *     ```
       ul.floatLi li {display: inline-block; margin-right: 10px;}
         ul.floatLi li:last-of-type {margin-right: 0px; clear: right;}
   
         ul.selfClearCont {
           text-align: center;
           padding: 0 !important;
           margin: 0 !important;
         }
   
         ul.selfClearCont li {
           list-style-type: none;
           padding: 0 0 10px 0 !important;
         }
         .selfClearCont:before,
         .selfClearCont:after {
           content:"";
           display:table;
         }
   
         .selfClearCont:after {
           clear:both;
         }
   
         .selfClearCont {
           zoom:1; /* For IE 6/7 (trigger hasLayout) */
         }
       ```
   
 * I did not test it out, but this should work.
 *  Thread Starter [CaliforniaSea](https://wordpress.org/support/users/californiasea/)
 * (@californiasea)
 * [11 years, 3 months ago](https://wordpress.org/support/topic/moving-submit-button-inline/#post-5848004)
 * Awesome, yep that worked! And thank you for the info on float:center. I’ve got
   a lot more to learn.

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Moving Submit Button Inline’ is closed to new replies.

 * ![](https://ps.w.org/contact-form-7/assets/icon.svg?rev=2339255)
 * [Contact Form 7](https://wordpress.org/plugins/contact-form-7/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/contact-form-7/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/contact-form-7/)
 * [Active Topics](https://wordpress.org/support/plugin/contact-form-7/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/contact-form-7/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/contact-form-7/reviews/)

 * 4 replies
 * 2 participants
 * Last reply from: [CaliforniaSea](https://wordpress.org/support/users/californiasea/)
 * Last activity: [11 years, 3 months ago](https://wordpress.org/support/topic/moving-submit-button-inline/#post-5848004)
 * Status: resolved