Community Forums › Forums › Archived Forums › Design Tips and Tricks › eNews Extended Plugin & eleven40 Pro – Submit button + Email adress in same line
Tagged: Eleven40-Pro, eNews extended, Genesis eNews Extended
- This topic has 7 replies, 2 voices, and was last updated 9 years, 9 months ago by
Anita.
-
AuthorPosts
-
August 17, 2013 at 5:03 am #57021
markmaslow
ParticipantDear all,
I use the Genesis eNews Extended Plugin in the Footer Widget Area of the eleven40 Pro Theme.
Since I updated from eleven40 --> eleven40 Pro, the "Submit button" slipped into a new line and therefore takes up a lot space.
For the previous eleven40 Theme, I managed to get the button next to the imput field (78% width input vs. 22% button).
Since, I'm no CSS pro, I currently lost how to do that for the new theme (eleven 40 pro).
This is, what is currently in my style.css
/* Genesis eNews Extended --------------------------------------------- */ .enews-widget input { margin-bottom: 16px; margin-bottom: 1.6rem; } .enews-widget input[type="submit"] { width: auto; display: block; margin: auto; }
I would be more than happy if you could help me get the button one line above as in the tutorial for the Minimum 2.0 theme:
http://www.brandonkraft.com/uploads/enews-minimum-style-go.png
Thanks so much in advance!
Regards,
http://www.marathonfitness.de
MarkAugust 18, 2013 at 10:24 am #57164Anita
KeymasterMark, is this for your marathonfitness.de website or a different website? If different, please post the link.
Love coffee, chocolate and my Bella!
August 18, 2013 at 10:40 am #57169markmaslow
ParticipantThanks for your reply!
This is for http://www.marathonfitness.de.
August 18, 2013 at 11:11 am #57174Anita
KeymasterTry adding the float, margin and width the way I have it here. I think the text below it might go a little wonky, but we can see after you add it.
.enews-widget input {
margin-bottom: 16px;
margin-bottom: 1.6rem;
width: 45%;
float: left;
margin-right: 5px;
}
Love coffee, chocolate and my Bella!
August 18, 2013 at 2:16 pm #57199markmaslow
ParticipantThis is great stuff, Anitac.
Yeah, we're getting closer... Now, the optin-boxes don't take that much space anymore.
What I would love, to change is, to have the first box take up a whole line and the second one (the one with the email address) ca. 70% and the button right next to it on the right.
Any ideas?
Thanks for your help!
August 18, 2013 at 2:48 pm #57202Anita
KeymasterIt's close. I had to redo the code so match this up with what you have. The bottom text seems to be rendering before the submit button. I think the only way to get the submit to line up next to the second field is to remove the bottom text.
.enews-widget input {
float: left;
margin-bottom: 1.6rem;
margin-right: 5px;
width: 200px !important;
}.enews-widget #subbox1 {
float: left;
margin-bottom: 1.6rem;
margin-right: 5px;
width: 350px !important;
}.enews-widget input[type="submit"] {
display: block;
float: right;
margin: auto;
width: auto;
}
Love coffee, chocolate and my Bella!
August 18, 2013 at 3:13 pm #57209markmaslow
ParticipantYou are fantastic! I got it!
Entering your code made the layout appear ALMOST as I desired.
I tried a few tweaks and now it's perfect.
This is the final solution:
.enews-widget input { float: left; margin-bottom: 1.6rem; margin-right: 5px; width: 68% } .enews-widget #subbox1 { float: left; margin-bottom: 1.6rem; margin-right: 5px; width: 100% } .enews-widget input[type="submit"] { display: block; float: right; margin: auto; width: 28%; }
The text beneath seems to be OK so far!
Thank you so much...!
August 18, 2013 at 3:26 pm #57212Anita
KeymasterOh, you're welcome. Glad you got it.
Love coffee, chocolate and my Bella!
-
AuthorPosts
- The forum ‘Design Tips and Tricks’ is closed to new topics and replies.