Style WPForms using CSS - Customise using Elementor page builder

Learn how to style and design WPForms using CSS and elementor. Easier than you think. Things you'll learn include customising WPForms, CSS styling, Working with WPForms in elementor

Get WPForms here:
https://shrsl.com/258qs

► Get Elementor Pro — https://wpalgoridm.com/elementor


Elementor free version custom css:
https://youtu.be/EEq5EGlEQds

*************CSS discussed in the video******************
/*Code starts here*/
selector form input[type="text"],selector form input[type="email"],selector form input[type="password"],selector form .wpforms-smart-phone-field{
width: 50%!important;

}
selector form .wpforms-smart-phone-field{
width: 50%!important;
border: 2px solid #4C4CA7!important;
color: blue!important;
}

selector form input[type="email"]{
border: 2px solid blue;
}
selector form input[type="text"]{
border:2px solid purple;
border-radius: 10px;
}

selector form input[type="password"]{
color:red!important;
}

selector form textarea{
width: 50%;
border: 2px solid purple;
background: #4C4CA7;
color: white;
}

selector form .wpforms-field-radio label{
color: white;
}
selector form .wpforms-field-checkbox label{
color:white;
}
selector form select {
color: white;
background: #4C4CA7;
border: none;
width: 50%;
}
selector form .wpforms-field-select label{
color:white;
}
selector form button{
background: #4C4CA7!important;
width: 50%;
color: white!important
}

selector form .wpforms-field-textarea label{
color: white;
}

/*focus states*/

selector form input[type="text"]:focus{
background: #4C4CA7!important;
border: none;
color: white;
}

selector form textarea:focus{
width: 100%;
}

selector form select:focus {
border: 2px solid blue;
}

/*valid*/
selector form input[type="email"]:valid{
border: 2px solid green;
}

/*invalid*/
selector form input[type="email"]:invalid{
border: 2px solid red;
}

/*Code ends above*/



*************End of the code above******************

Learn all about WPForms:
https://www.youtube.com/playlist?list=PL19jB3vK-qIXXr6vV2tvldArEzYYthRPZ

Join our Facebook Group:
https://www.facebook.com/groups/designschoolwp


****Disclaimer***
Above links can contain affiliate links that'll not cost you more but rather help me bring more awesome content to you. Thank you for support!