thanks to Geno at for the following code to Customize the Divi Subscribe module;

Add a class to your subscribe module and then add the following code into your child-theme CSS file;

/*---------------[Custom Subscribe]---------------*/
.demo-subscribe-section .et_pb_newsletter{padding: 20px 10px; border-radius:10px;}
.demo-subscribe-section .et_pb_newsletter_description {padding: 0 0 20px 0; width: 100%;}
.demo-subscribe-section .et_pb_newsletter_form {width: 100%;}
.demo-subscribe-section .et_pb_newsletter_form p {display: inline-block; margin-right: 40px;}
.demo-subscribe-section .et_pb_newsletter_form p input { padding: 8px 4% !important; width: 300px;}
.demo-subscribe-section .et_pb_newsletter_button {padding: 2px 6px;}
.demo-subscribe-section a.et_pb_newsletter_button:hover {padding: 2px 6px!important;}
.demo-subscribe-section a.et_pb_newsletter_button:after {display:none;}
.demo-subscribe-section .et_pb_newsletter_form p:nth-child(3) {display: none;}
@media only screen and (max-width: 1100px) {
.demo-subscribe-section .et_pb_newsletter_form p input { padding: 8px 4% !important; width: 275px;}
@media only screen and (max-width: 980px) {
.demo-subscribe-section .et_pb_newsletter_form p input { padding: 8px 4% !important; width: 220px;}
.demo-subscribe-section .et_pb_newsletter_description { width: 100% !important;}
@media only screen and (max-width: 767px) {
.demo-subscribe-section .et_pb_newsletter_form p input { padding: 8px 4% !important; width: 240px;}
@media only screen and (max-width: 479px) {
.demo-subscribe-section .et_pb_newsletter_form p input { padding: 8px 4% !important; width: 180px;}

Pin It on Pinterest

By continuing to use the site, you agree to the use of cookies. more information

The cookie settings on this website are set to "allow cookies" to give you the best browsing experience possible. If you continue to use this website without changing your cookie settings or you click "Accept" below then you are consenting to this.