Variable Input - Dropdown: move drop down field to the center

[Costa]

Hey :),

can someone help me out and provide me with a CSS Code to move the variable input object as a drop down to the center so it is aligned with the button to the right?

[saso70]

Hi, please open Developer tools and select variable input object and find tid

use following css; 

div[tid="eyPDc"] {
position:absolute;
top:20px !important;
}

You can use if you need following css property to move the object top, bottom, left, right.

I hope this will help you 

[Costa]

Hey Saso,

first off, many thanks! 

I changed the "top 20px" to 270px to align with the buttons on the rights.

it kind of works (don't be irritated by the grey coloring,...)

 

However, if i switch the screen (e.g. to my notebook) it is completly offset:

So the top:- statement moves the whole object and not the drop down class within the object.

Did I do something wrong?

Best

[saso70 · Accepted solution]

Hi , probably you will need to use calc function in css to calculate top position , now this position is static and for different size of screen will be different position please check the calc function https://developer.mozilla.org/en-US/docs/Web/CSS/calc

[Costa]

it works 🙂 - Many thanks

div[tid="wYpPJM"] {
position:absolute;
top: calc(24% - 10px) !important;
}

div[tid="kpcrh"] {
position:absolute;
top: calc(12.8% - 10px) !important;
}