Community Forums › Forums › Archived Forums › Design Tips and Tricks › Formatting eNews Extended in Parallax Pro
Tagged: eNews extended, parallax-pro
- This topic has 3 replies, 2 voices, and was last updated 9 years, 1 month ago by
Tom.
-
AuthorPosts
-
December 19, 2015 at 12:39 pm #174345
Jamie
MemberHi, I was able to add the CTA widget under Home Section 1 in Parallax Pro, and I added the eNews Extended widget to it.
The problem is, I can't find where I'm supposed to edit the background color and the width of the input boxes. I was able to change some of the parts in Inspector, but I can't find the spot in the actual stylesheet where I'm supposed to make the real changes. Help?
I want the input boxes to be white but only about 20% across the page, so the first name, last name, email, and submit boxes/buttons will all display in one row.
And I want the entire horizontal stripe across the page to be orange - #fa4802.
I'm at http://www.jamierohrbaugh.com. Please excuse the mess; this is only a sandbox site.
http://www.jamierohrbaugh.com
Thanks!December 19, 2015 at 3:56 pm #174357Tom
ParticipantI see what you did there 🙂 ... and updated my tutorial to suit using 4-elements in Enews Extended (Fname Lname, Email, submit). Use the following CSS:
/* Home Call-To-Action - 4-Elements: FNAME LNAME EMAIL SUBMIT ------------------------------------------------------------- */ .home-section-1 { -webkit-box-shadow: 3px 5px 9px 3px rgba(0, 0, 0, 0.4); /* Safari 3-4, iOS 4.0.2 - 4.2, Android 2.3+ */ -moz-box-shadow: 3px 5px 9px 3px rgba(0, 0, 0, 0.4); /* Firefox 3.5 - 3.6 */ box-shadow: 3px 5px 9px 3px rgba(0, 0, 0, 0.4); /* Opera 10.5, IE 9, Firefox 4+, Chrome 6+, iOS 5 */ } .home-cta { background: #fa4802; box-shadow: 3px; clear: both; float: left; margin: 0px; padding: 30px 0 10px; width: 100%; } .home-cta p { color: #fff; display: inline-table; float: left; font-family: Montserrat, sans-serif; font-size: 20px; line-height: 1.1; margin: 15px 0 40px; text-align: center; width: 100%; } .home-cta .enews form { clear: none !important; float: left; width: 100%; } .home-cta .enews-subbox, .home-cta #subbox { clear: none !important; float: left; margin-right: 2%; width: 25%; } .home-cta #subbutton { float: right; width: 15%; } .home-cta #subbutton:hover { background: #fff; color: #fa4802; } .home-cta #subbox1.enews-subbox, /* fname */ .home-cta #subbox2.enews-subbox, /* lname */ .home-cta #subbox /* email */ { font-family: Montserrat, sans-serif; font-size: 14px; padding: 16px; text-align: center; } .home-cta input[type="submit"] { background-color: transparent; border: 2px solid #fff; font-size: 18px; padding: 13px; } @media only screen and (max-width: 960px) { .home-cta p { margin: 5px 0 40px; } } @media only screen and (max-width: 782px) { .home-cta .enews form { float: none; margin-left: auto; margin-right: auto; width: 90%; } .home-cta input#subbox /* email */ { clear: both; } .home-cta .enews-subbox, .home-cta #subbox { clear: none !important; float: left; margin-right: 2%; width: 48%; } .home-cta #subbox2.enews-subbox, /* lname */ .home-cta #subbutton { clear: none !important; float: right ; margin-right: 0; width: 48%; } } @media only screen and (max-width: 480px) { .home-cta .enews-subbox, .home-cta #subbox2.enews-subbox, .home-cta #subbox, .home-cta #subbutton { clear: both; float: none; margin-right: 0%; width: 100%; } .home-cta .enews p { width: 100%; margin-bottom: 40px; } .home-cta .enews form { clear: both; width: 100%; } }
Choose your next site design from over 350 Genesis themes.
[ Follow me: Twitter ] [ Follow Themes: Twitter ] [ My Favourite Webhost ]December 19, 2015 at 4:30 pm #174359Jamie
MemberAwesome! It worked! Thank you so much!
December 19, 2015 at 8:01 pm #174365Tom
ParticipantMay you gain many subscribers!
Choose your next site design from over 350 Genesis themes.
[ Follow me: Twitter ] [ Follow Themes: Twitter ] [ My Favourite Webhost ] -
AuthorPosts
- The topic ‘Formatting eNews Extended in Parallax Pro’ is closed to new replies.