What This CSS Code Does:
Adds a gradient border to any element in Elementor.
Usage Examples:
How To Implement:
Click on the Advanced tab within the form element, go down to the Custom CSS option and paste the code. Make sure to add the CSS Class under Layout (it’s sampleform for this example). Make sure to reupload the image below and modify the background image URL within the CSS code. Feel free to use this image or make your own. It’s not the nicest, sorry about that.
The Code:
.sampleform .elementor-field-type-upload {
background-color: #fff;
border-radius: 8px;
height: 120px;
width: 96%;
box-sizing: border-box;
max-width: 96%;
margin: 0 auto;
background-image: url('/wp-content/uploads/2024/03/photo_2022-12-20_01-58-41.jpg');
background-repeat: no-repeat;
background-position: center;
background-size: contain;
}
.sampleform .elementor-field-type-upload .elementor-upload-field {
width: 100%;
height: 120px;
display: flex;
align-items: center;
justify-content: center;
opacity: 0;
}