Date picker sizing [RESOLVED]

[user61086a4ec00f9639 (Tom Martin)]

Hello, i want to make date picker windows ( Date Drop Down) a little bigger to normally show year month date or make arow smaller as it hide almost half of date picker window

[obijuan (Juan Machado)]

Hi, Tom.

The Date Drop Down should display like this by default:

Can you please check for any front-end conflicts on your website? Either produced by a third-party plugin or your active theme.

[faisalahammad]

Hey Tom,
Could you please share your exact webpage URL where you’re having the date picker (small size) issue? So I can further investigate to resolve it?

[user61086a4ec00f9639 (Tom Martin)]

Hello here are the link where if at the bottom you select number of childrens you will get date picker with that look

Summary

Pildyti žalios kortos paraišką - ZALIAKORTA.EU - DV loterija DV2026, zalios kortos pildymas, dv loterijos pildymas, dalyvauti dv loterijoje, zalia korta, dv lottery,)

[faisalahammad]

Hey Tom,

The issue is caused by the Avada theme conflict. To resolve the issue, please use the following CSS in your child theme’s style.css file or in Appearance → Customize → Additional CSS.

#input_4_6.ginput_complex .gravity-select-parent {
  width: 100% !important;
}

#input_4_6.ginput_complex .ginput_container_date select {
  min-width: 130px !important;
}

#input_4_6 .gravity-select-parent .select-arrow {
  left: 80px !important;
}

Then, the output will look like the following screenshot.

Give it a try, and let me know how that goes!

[user61086a4ec00f9639 (Tom Martin)]

@faisalahammad

#input_4_6.ginput_complex .gravity-select-parent {
  width: 100% !important;
}

#input_4_6.ginput_complex .ginput_container_date select {
  min-width: 130px !important;
}

#input_4_6 .gravity-select-parent .select-arrow {
  left: 80px !important;
}

Hello, thank you for your reply, but it not helping wery well this code only changes that parts which are in code, So if I have 6 parts for 6 children s then I need to add the same code for ewery part other vice it will look like this

[faisalahammad]

Hey Tom,

Please try the following code instead of the last provided code. This code will be applied to all date fields you are using on your website.

.gfield--type-date .ginput_complex .gravity-select-parent {
  width: 100% !important;
}

.gfield--type-date .ginput_complex .ginput_container_date select {
  min-width: 130px !important;
}

.gfield--type-date .gravity-select-parent .select-arrow {
  left: 80px !important;
}

Please keep me posted about the outcome. Thank you