Hi pennywhistle!! You can either edit the plugin to remove the placeholder, or add the following CSS to your site:
.constantcontactwidget_form input::-webkit-input-placeholder {
color: transparent;
}
.constantcontactwidget_form input:-moz-placeholder {
color: transparent;
}
.constantcontactwidget_form input::-moz-placeholder {
color: transparent;
}
.constantcontactwidget_form input:-ms-input-placeholder {
color: transparent;
}
Thank you for the swift reply. That worked! Just one thing, though. I have a feeling that the styling of this form is interfering with the search box on this page http://stage.sverdlawfirm.com/sample-page/, knocking the magnifying glass to the next line. (This is what that search box is supposed to look like: http://themeforest.net/item/the-practice-lawyer-wordpress-theme/full_screen_preview/7631488.)
I tried fixing it by prefacing all the CSS related to this plugin with .constantcontactwidget_form, but it didn’t work. Here’s the CSS:
.constantcontactwidget_form {
padding: 20px;
background: #ebebeb;
}
.constantcontactwidget_form .input[type="reset"], input[type="submit"], input[type="button"], button {
border: none;
color: #FFFFFF;
margin-left: 10px;
padding: 0;
height: 32px;
width: 80px;
line-height: 32px;
text-align: left;
font-family: 'Lato', Arial, Helvetica, sans-serif;
font-size: 13px;
text-align: center;
background: url(http://stage.sverdlawfirm.com/wp-content/uploads/2015/06/btn_arrow_blue2.png) right 0 no-repeat;
background-image: url(http://stage.sverdlawfirm.com/wp-content/uploads/2015/06/btn_arrow_blue2.png);
background-position-x: 100%;
background-position-y: 0px;
background-size: initial;
background-repeat-x: no-repeat;
background-repeat-y: no-repeat;
background-attachment: initial;
background-origin: initial;
background-clip: initial;
background-color: initial;
}
.constantcontactwidget_form input[type="text"], input[type="password"], input[type="email"], select {
height: 30px;
line-height: 20px;
width: 180px;
height: 22px;
margin: 0px;
}
.constantcontactwidget_form .entry p, .summary p {
margin: 0px;
}
.constantcontactwidget_form input::-webkit-input-placeholder {
color: transparent;
}
.constantcontactwidget_form input:-moz-placeholder {
color: transparent;
}
.constantcontactwidget_form input::-moz-placeholder {
color: transparent;
}
.constantcontactwidget_form input:-ms-input-placeholder {
color: transparent;
}
Hi pennywhistle! You need to add .constantcontactwidget_form in front of every rule, i.e. instead of:
.constantcontactwidget_form input[type=”text”], input[type=”password”] …
it should be
.constantcontactwidget_form input[type=”text”], .constantcontactwidget_form input[type=”password”]
Yes! Many thanks! So one last small thing: The space below “Enter Your Email Address” should be 0 px. I thought I could set this, based on the Chrome developer tool, to this:
.constantcontactwidget_form .constantcontactwidget_form entry p, .constantcontactwidget_form .constantcontactwidget_form summary p {
margin: 0px;
}
But that didn’t work.
