0

Drop down menu broken on Windows Chrome. Works perfectly fine on MAC Chrome and the letters aren't cut off. The problem:

picture

The word, select, should be completely visible.

The CSS is basic:

.form-control {
    height: 30px;
    width: 50%;
    padding: 8px 12px;
    font-size: 13px;
}

With standard bootstrap.

RomanK
  • 155
  • 1
  • 2
  • 13

2 Answers2

2

height: 30px; is likely your issue.

A quick look at the default .form-control in my Chrome inspector shows the elements as being 34px high. You've made the .form-control elements too small to display the entirety of their contents.

In general, you should avoid explicitly setting the height of these.

ceejayoz
  • 176,543
  • 40
  • 303
  • 368
0

I ran into this issue not long ago.

Removing the vertical padding is what set it to good in windows chrome for me. It didn't impact the display negatively in Mac Chrome for me either.

.form-control {
    height: 30px;
    width: 50%;
    padding: 0px 12px;
    font-size: 13px;
}
Jake
  • 65
  • 7