# Vertical align Placeholder text inside dcc.Dropdown

**URL:** <https://community.plotly.com/t/vertical-align-placeholder-text-inside-dcc-dropdown/43866>\
**Category:** Dash Python\
**Created:** [August 17, 2020, 11:11am UTC](https://community.plotly.com/t/vertical-align-placeholder-text-inside-dcc-dropdown/43866 "2020-08-17T11:11:43Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![KLTY](https://avatars.discourse-cdn.com/v4/letter/k/278dde/32.png) [@KLTY](https://community.plotly.com/u/KLTY)\
**Post date:** [August 17, 2020, 11:11am UTC](https://community.plotly.com/t/vertical-align-placeholder-text-inside-dcc-dropdown/43866/1 "2020-08-17T11:11:43Z")

</div>

Hi all,

I have inserted a dcc.Dropdown, and increased its height to fit my intended layout.

However, with the height increased, the placeholder text still remains near the top of the dcc.Dropdown.

I have tried styling with verticalAlign and padding, but to no avail. Anyone has any idea how to get the placeholder text to be center and middle?

---

<div class="post-metadata">

**Author:** ![MHong94](https://avatars.discourse-cdn.com/v4/letter/m/ecc23a/32.png) [@MHong94](https://community.plotly.com/u/MHong94)\
**Post date:** [January 2, 2021, 6:42am UTC](https://community.plotly.com/t/vertical-align-placeholder-text-inside-dcc-dropdown/43866/2 "2021-01-02T06:42:22Z")

</div>

Did you figure this out? Having the same problem.

---

<div class="post-metadata">

**Author:** ![KLTY](https://avatars.discourse-cdn.com/v4/letter/k/278dde/32.png) [@KLTY](https://community.plotly.com/u/KLTY)\
**Post date:** [January 2, 2021, 7:21am UTC](https://community.plotly.com/t/vertical-align-placeholder-text-inside-dcc-dropdown/43866/3 "2021-01-02T07:21:39Z")

</div>

Nope, in the end I went to learn Python Flask to restructure the site I wanted to create

---

<div class="post-metadata">

**Author:** ![MHong94](https://avatars.discourse-cdn.com/v4/letter/m/ecc23a/32.png) [@MHong94](https://community.plotly.com/u/MHong94)\
**Post date:** [January 2, 2021, 5:29pm UTC](https://community.plotly.com/t/vertical-align-placeholder-text-inside-dcc-dropdown/43866/4 "2021-01-02T17:29:41Z")

</div>

I figured it out, I’ll post it for anyone who comes across it in the future. I used the inspect feature on my browser (chrome) and readjusted the individual ‘div’ classes associated with dropdown menu in my custom css file

> .Select-placeholder, .Select-arrow-zone, .Select-input, .Select-value-label, .Select-clear-zone {  
> line-height: dropdown\_height;  
> }