Title: CSS Styling
Last modified: February 16, 2023

---

# CSS Styling

 *  Resolved [jjcstudios](https://wordpress.org/support/users/jjcstudios/)
 * (@jjcstudios)
 * [3 years, 3 months ago](https://wordpress.org/support/topic/css-styling-49/)
 * I have followed the instructions to change the styling on the button but it is
   not working.
 * I have included a page that uses this button so please look at the button below
   the form.
 * Thank you for any help.
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fcss-styling-49%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

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

 *  Plugin Author [Nick Ciske](https://wordpress.org/support/users/nickciske/)
 * (@nickciske)
 * [3 years, 3 months ago](https://wordpress.org/support/topic/css-styling-49/#post-16478690)
 * What is not working?
 *  Thread Starter [jjcstudios](https://wordpress.org/support/users/jjcstudios/)
 * (@jjcstudios)
 * [3 years, 3 months ago](https://wordpress.org/support/topic/css-styling-49/#post-16478816)
 * I was able to style the button easily about 3 years ago but when I try to change
   the button know it is not working
 *  Plugin Author [Nick Ciske](https://wordpress.org/support/users/nickciske/)
 * (@nickciske)
 * [3 years, 3 months ago](https://wordpress.org/support/topic/css-styling-49/#post-16478839)
 * Nothing has changed in the plugin that would cause that. Without more details
   I can’t really help you – where is the styling you want applied located in your
   site (theme? plugin? customizer?)
 *  Thread Starter [jjcstudios](https://wordpress.org/support/users/jjcstudios/)
 * (@jjcstudios)
 * [3 years, 3 months ago](https://wordpress.org/support/topic/css-styling-49/#post-16478860)
 * Nick the custom.css is in my astra child theme and I have also included the code
   below. It look like this is the right location but the button styling is not 
   showing up
 * wp-content/themes/astra-child/**salesforce-wordpress-to-lead**/**custom.css**
 *     ```wp-block-code
       /* SalesForce WordPress to Lead Default CSS */
   
       .salesforce_w2l_lead form.w2llead {
           text-align: left;
           clear: both;
       }
   
       .salesforce_w2l_lead #salesforce {
           margin: .25em 0 0 0;
           color: #aaa;
       }
   
       .salesforce_w2l_lead #salesforce a {
           color: #999;
       }
   
       .salesforce_w2l_lead .w2llabel, .w2linput {
           display: block;
           float: left;
           box-sizing: border-box;
           font-size: 14px !important;
       }
   
       .salesforce_w2l_lead .w2llabel.error {
           color: #f00;
       }
   
       .salesforce_w2l_lead .w2llabel {
           clear: left;
           margin: .25em 0;
           width: 50%;
       	color: #4c4c4c !important;
       	font-size: 16px !important;
       	font-weight:normal !important;
       }
   
       /* Changes font size in input fields */
       .salesforce_w2l_lead .w2linput.text {
           width: 50%;
           height: auto;
           margin: .25em 0;
           font-size: 14px !important;
       }
   
       /* Changes font size in message fields */
       .salesforce_w2l_lead .w2linput.textarea {
           width: 100%;
           height: 6em;
           margin: .75em 0;
           font-size: 14px !important;
       }
   
       .salesforce_w2l_lead .w2lsubmit {
           float: none;
           clear: both;
           padding: .5em 0;
       }
   
       .salesforce_w2l_lead .w2linput.submit {
       	border-top: 1px solid #1f42aa;
       	background: #021660;
       	background: -webkit-gradient(linear, left top, left bottom, from(#1f42aa), to(#021660));
       	background: -webkit-linear-gradient(top, #1f42aa, #021660);
       	background: -moz-linear-gradient(top, #1f42aa, #021660);
       	background: -ms-linear-gradient(top, #1f42aa, #021660);
       	background: -o-linear-gradient(top, #1f42aa, #021660);
       	padding: 9px 18px;
       	-webkit-border-radius: 0px;
       	-moz-border-radius: 0px;
       	border-radius: 0px;
       	-webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
       	-moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
       	box-shadow: rgba(0,0,0,1) 0 1px 0;
       	text-shadow: rgba(0,0,0,.4) 0 1px 0;
       	color: #ffffff;
       	font-size: 18px;
       	font-family: Helvetica, Arial, Sans-Serif;
       	text-decoration: none;
       	vertical-align: middle;
       }
   
       .salesforce_w2l_lead .w2linput.submit:hover { 
       	border-top-color:  #021660;
       	background: #021660;
       	color: #ccc;
       }
   
   
       .w2lsubmit {
           height: 50% !important;
       }
   
       .salesforce_w2l_lead .w2llabel.checkbox,
       .salesforce_w2l_lead .w2linput.checkbox {
           display: inline-block;
           float: none;
       }
   
       .salesforce_w2l_lead .sf_type_checkbox input {
           width: 1.25em;
       }
   
       .salesforce_w2l_lead .w2llabel.checkbox {
           clear: none;
           margin: 0;
       }
   
       .salesforce_w2l_lead .w2linput.textarea, .salesforce_w2l_lead .w2linput.text {
           font-size: inherit;
       	width: 100%;
       }
   
       .salesforce_w2l_lead .top-aligned .w2linput {
           clear: left;
       }
   
       .salesforce_w2l_lead .top-aligned .w2llabel {
           width: 100%;
       }
   
       .salesforce_w2l_lead .left-aligned .w2llabel {
           width: 25%;
       }
   
       .salesforce_w2l_lead .left-aligned .w2linput.text, .salesforce_w2l_lead .left-aligned .w2linput.textarea {
           width: 75%;
       }
   
       .salesforce_w2l_lead .sidebar.left-aligned .w2llabel, .salesforce_w2l_lead .sidebar.left-aligned .w2linput {
       	width: 50%;
       }
   
       .salesforce_w2l_lead .sidebar.left-aligned .w2llabel.checkbox {
       	width: auto;
       }
   
       .salesforce_w2l_lead .sidebar.left-aligned .w2linput.checkbox {
       	width: 1.25em;
       }
   
       .salesforce_w2l_lead .top-aligned .w2llabel.checkbox, .salesforce_w2l_lead .left-aligned .w2llabel.checkbox {
           width: auto;
       }
   
       .salesforce_w2l_lead .placeholders .w2linput {
       }
   
       .salesforce_w2l_lead .w2linput.text.captcha {
           width: 45%;
           float: left;
           clear: none;
       }
   
       .salesforce_w2l_lead .w2limg {
           display: block;
           clear: both;
           float: left;
       	width: 45%;
       	height: 50px;
       }
   
       .salesforce_w2l_lead .required {
           font-weight: normal;
           color: inherit;
       }
   
       .salesforce_w2l_lead span.required {
           color: red;
       }
   
       .salesforce_w2l_lead .left-aligned .w2limg {
           float: left;
           clear: none;
       }
   
       .salesforce_w2l_lead .w2linput.text.captcha {
           height: 50px;
           margin: 0 0 0 .5em;
           font-size: 14px;
           font-family: Roboto;
           text-align: center;
       }
   
       .salesforce_w2l_lead .sf_cc_user {
           padding: 1em 0;
       }
   
       .salesforce_w2l_lead .sidebar .w2linput, .salesforce_w2l_lead .sidebar .w2llabel {
           float: none;
           display: block;
       }
   
       .salesforce_w2l_lead .sidebar .w2linput.checkbox, .salesforce_w2l_lead .sidebar .w2llabel.checkbox {
           float: none;
           display: inline-block;
           width: auto;
       }
   
       .salesforce_w2l_lead .sidebar.left-aligned .w2linput, .salesforce_w2l_lead .sidebar.left-aligned .w2llabel {
           float: left;
           display: inline;
       }
   
       .salesforce_w2l_lead .sidebar.left-aligned .w2linput.checkbox, .salesforce_w2l_lead .sidebar.left-aligned .w2llabel.checkbox {
           float: none;
       }
   
       .salesforce_w2l_lead .sidebar.left-aligned .w2linput.checkbox{
       	float: none;
       }
   
       .salesforce_w2l_lead .sidebar .w2llabel.error {
           color: #f00;
       }
   
       .salesforce_w2l_lead .sidebar .w2llabel {
           padding: .15em 0;
       }
   
       .salesforce_w2l_lead .sidebar .top-aligned .w2llabel {
           float: none;
           display: block;
       }
   
       .salesforce_w2l_lead .sidebar select {
       	max-width: 100%;
       }
   
       .salesforce_w2l_lead .sidebar .w2linput.text {
           width: 95%;
           height: auto;
           margin: .25em 0;
       }
   
       .salesforce_w2l_lead .sidebar .w2linput.textarea {
           width: 95%;
           height: 4em;
           margin: .25em 0;
       }
   
       .salesforce_w2l_lead .sidebar.left-aligned .w2linput.textarea, .salesforce_w2l_lead .sidebar.left-aligned .w2linput.text {
       	width: 50%;
       }
   
       .salesforce_w2l_lead .sidebar .w2lsubmit {
           float: none;
           clear: both;
           padding: .5em 0;
           display: block;
           width: 100%;
       }
   
       .salesforce_w2l_lead .sidebar .sf_type_captcha {
           text-align: center;
       }
   
       .salesforce_w2l_lead .sidebar .sf_type_captcha .w2llabel {
           padding: .5em 0;
           display: inline-block;
           width: 100%;
       }
   
       .salesforce_w2l_lead .sidebar .w2linput.text.captcha, .salesforce_w2l_lead .sidebar .w2limg {
           float: none;
           display: inline-block;
       }
   
       .salesforce_w2l_lead .sidebar .w2linput.text.captcha {
           margin: .25em 0 0 0;
           height: auto;
           font-size: 1em;
       }
   
       .salesforce_w2l_lead .sf_field, .sf_type_checkbox {
           clear: both;
       }
   
       .salesforce_w2l_lead .sidebar .sf_field{
       	padding: .25em 0;
       }
   
       .salesforce_w2l_lead .sf_field span.error_message {
           clear: left;
           display: block;
           color: red;
           font-size: 80%;
       }
   
       .salesforce_w2l_lead .clearfix {
           clear: both;
       }
   
       .salesforce_w2l_lead .sf_required_fields_msg{
           font-size: 16px !important;
       	clear: both;
       	display: block;
       	float: none;
       }
       ```
   
 *  Plugin Author [Nick Ciske](https://wordpress.org/support/users/nickciske/)
 * (@nickciske)
 * [3 years, 3 months ago](https://wordpress.org/support/topic/css-styling-49/#post-16504048)
 * You placed that in **astra-child** but that is not the active theme on your site,**
   astra** is, so the plugin is not loading it. You’ll need to move it to the active
   theme, switch themes, or manually enqueue the CSS in functions.php.
 *     ```wp-block-code
       <link rel="stylesheet" id="astra-theme-css-css" href="http://www.covetruscareplans.com/wp-content/themes/astra/assets/css/minified/style.min.css?ver=3.9.4" media="all">
       ```
   

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

The topic ‘CSS Styling’ is closed to new replies.

 * ![](https://ps.w.org/salesforce-wordpress-to-lead/assets/icon-256x256.png?rev
   =2316786)
 * [Brilliant Web-to-Lead for Salesforce](https://wordpress.org/plugins/salesforce-wordpress-to-lead/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/salesforce-wordpress-to-lead/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/salesforce-wordpress-to-lead/)
 * [Active Topics](https://wordpress.org/support/plugin/salesforce-wordpress-to-lead/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/salesforce-wordpress-to-lead/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/salesforce-wordpress-to-lead/reviews/)

 * 5 replies
 * 2 participants
 * Last reply from: [Nick Ciske](https://wordpress.org/support/users/nickciske/)
 * Last activity: [3 years, 3 months ago](https://wordpress.org/support/topic/css-styling-49/#post-16504048)
 * Status: resolved