By default, the module displays fields and button underneath each other. This CSS displays them in a horizontal row. Original from : <http://quiroz.co/customizing-the-subscribe-module-in-divi/>

Or use this new method here: <https://divilover.com/slim-divi-optin-form-module-layout/>

/*----------[E-mail Optin Form]----------*/
.email-optin .et_pb_newsletter{padding: 20px 10px;
border-radius:10px;}
.email-optin .et_pb_newsletter_description {padding: 0 0 20px 0;
width: 100%;}
.email-optin .et_pb_newsletter_form {width: 100%;}
.email-optin .et_pb_newsletter_form p {display: inline-block;
margin-right: 20px;}
.email-optin .et_pb_newsletter_form p input { padding: 8px 4%
!important; width: 300px;}
.email-optin .et_pb_newsletter_button {padding: 2px 10px;}
.email-optin a.et_pb_newsletter_button:hover {padding: 2px
10px!important;}
.email-optin a.et_pb_newsletter_button:after {display:none;}
.email-optin .et_pb_newsletter_fields {display:
inline-block!important;}
.et_pb_column_4_4>.et_pb_newsletter { display: inherit; align-items:
center; }
@media only screen and (max-width: 1100px) {
.email-optin .et_pb_newsletter_form p input { padding: 8px 4%
!important; width: 230px;}
}
@media only screen and (max-width: 980px) {
.email-optin .et_pb_newsletter_form p input { padding: 8px 4%
!important; width: 180px;}
}
@media only screen and (max-width: 767px) {
.email-optin .et_pb_newsletter_form p input { padding: 8px 4%
!important; width: 300px;}
.email-optin .et_pb_newsletter_form p {display: inherit; margin-right:
0px;}
}
@media only screen and (max-width: 479px) {
.email-optin .et_pb_newsletter_form p input { padding: 8px 4%
!important; width: 250px;}
}
/*------------[End E-mail Optin
Form]-------------*/
Code language: CSS (css)