Form Use Not In Header

Hi again,

Anytime I try to include a form not in the header, the Sign Up button (or however you want to name it) is on the left side of where the user inputs their email address rather than the right.

How do I avoid this? How do I move the Sign Up button to the right of the text field?

Here's the code I'm using in the text widget which I placed in the Bottom VI position:

Code: Select all

<h3>Find out when MindSpace is ready for release. Just ONE email!<br> </br></h3>

<form class="gk-form">
<div><input type="email" placeholder="Email address ..."> <input type="submit" value="Get Started today!"></div>
</form>

And here is a link to my webpage: http://www.mindspaceapp.com/
Thanks!

Hi,

This style is only for Header area, if you want to use it in Bottom VI, add this code into css/override.css file:

Code: Select all

#gk-bottom6 .gk-form {
   background: rgba(255, 255, 255, .12);
   border: 1px solid #ddd;
   -webkit-border-radius: 3px;
   -moz-border-radius: 3px;
   border-radius: 3px;
   display: inline-block;
   margin: 50px 0 65px 0;
   padding: 10px 10px 7px 10px;
}

#gk-bottom6 .gk-form input[type="email"] {
   -webkit-border-radius: 3px;
   -moz-border-radius: 3px;
   border: none!important;
   border-radius: 3px;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
   color: #999;
   display: inline-block;
   font-size: 20px;
   font-style: italic;
   font-weight: 300;
   height: 68px;
   margin: 0!important;
   padding: 0 30px;
   position: relative;
   top: -3px;
   width: 456px;
}

#gk-bottom6 .gk-form input[type="submit"] {
   background: #4c90fe;
   border: none!important;
   -webkit-border-radius: 3px;
   -moz-border-radius: 3px;
   border-radius: 3px;
   -webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
   box-sizing: border-box;
   display: inline-block;
   float: none;
   font-size: 26px;
   font-weight: 400;
   height: 68px;
   margin: 0 0 0 10px;
   padding: 0 30px;
}

#gk-bottom6 .gk-form input[type="submit"]:active,
#gk-bottom6 .gk-form input[type="submit"]:focus,
#gk-bottom6 .gk-form input[type="submit"]:hover {
   background: #fec54c;
}