Elementor Forms: Double Arrows at select & Textarea height

Hey,

i have two layout issues with input fields and elementor at forms.

Issue 1) Select elements with two down-arrows
At dropdown selects there is the arrow defined by elementor and the down-arrow defined by woodmart.

The first is defined for the parent div-container
/wp-content/plugins/elementor/assets/css/frontend.min.css?ver=2.9.14
frontend-min.css:2
(Line 1435)

.elementor-field-group .elementor-select-wrapper::before {
    content: "\e92a";
    font-family: eicons;
    font-size: 15px;
    position: absolute;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 10px;
    pointer-events: none;
}

The second is defined for the select-element itself:
/wp-content/themes/woodmart/css/style-elementor.min.css?ver=5.1.0
style-elementor.min.css:1
(Line 25125)

body .select2-container--default .select2-selection--single .select2-selection__arrow, select {
    background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNSIgaGVpZ2h0PSIyNSIgZmlsbD0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2U9IiNiYmIiPjxwYXRoIGQ9Ik02IDlsNiA2IDYtNiIvPjwvc3ZnPg==);
}

and

/wp-content/themes/woodmart/style.css?ver=5.1.0
style.css:20919
(Line 20919)

select, body .select2-container--default .select2-selection--single .select2-selection__arrow {
    background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNSIgaGVpZ2h0PSIyNSIgZmlsbD0ibm9uZSIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2U9IiNiYmIiPjxwYXRoIGQ9Ik02IDlsNiA2IDYtNiIvPjwvc3ZnPg==");
}

Issue 2) Textarea height (rows) gets ignored
Additional the rows i setted in Elementor for the textarea-field gets ignored as long as i dont deactivate this two entries in the Inspector:
/wp-content/plugins/elementor/assets/css/frontend.min.css?ver=2.9.14
frontend.min.css:2
(Line 1500)

.elementor-field-textual.elementor-size-md {
    min-height: 47px;
}

and
/wp-content/plugins/elementor/assets/css/frontend.min.css?ver=2.9.14
frontend.min.css:2
(Line 1486)

.elementor-field-textual {
    min-height:40px;
}

Because of this shouldn’t be normal i dont want to temp fix this with custom css but changing the issued setting (if there is a setting for this)

Hello,

Could you please disable all plugins that are not related to our theme and provide us your admin access so we can check it?

Thank you in advance

Thank you for your answer.
Could you give me a time when you can work on it?
BEcause of we are still working on our site i cant disable all plugins for a day to wait

We will be online for next 4 hours and ready to do the check quickly.

Plugins are disabled but you can check by yourself

Try to add the following code snippet to the Custom CSS area in Theme Settings to fix this issue.

.elementor-field-group .elementor-select-wrapper:before {
  display: none;
}

And you can change the form height with Elementor option https://prnt.sc/u1oh6c

Hello,

1)
like i wrote i would like to find the issue instead of solving this temporary with custom css. On your demo sites this arrows are also not twice.

2) The “Eingabegröße” just defined the standard padding of the fields, but the general height of the textarea which is defined by “Reihen” (Rows) when you open the field settings of the “Nachricht” field gets ignored

1. This issue is with Elementor Pro and will be fixed in our update. On our demo we don’t use the Pro version.

2. Yes, this will be fixed too.

Thank you for your answer.
Could you estimate when the update will be released?

We hope to release the update next week.

[Author]

Posts