Select 组件 设置 showSearch 和 特定的style属性后，input光标位置异常、弹出popup行为异常

[BernardZhang]

• I have searched the issues of this repository and believe that this is not a duplicate.

Reproduction link

Steps to reproduce

import React from 'react';
import ReactDOM from 'react-dom';
import 'antd/dist/antd.css';
import { Select } from 'antd';

const { Option } = Select;

ReactDOM.render(
<Select
showSearch
style={{ minWidth: 160, height: 28, lineHeight: 28 }}

<Option value="jack">Jack</Option>
<Option value="lucy">Lucy</Option>
<Option value="tom">Tom</Option>

,
document.getElementById('container'),
);

What is expected?

搜索输入框位置、显示下拉popup的点击区域正常（点击Select组件区域才显示下拉）

What is actually happening?

搜索输入框位置异常、点击Select组件区域下方空白区域也显示下拉内容

Environment	Info
antd	4.4.3
React	16.13.0
System	mac
Browser	chrome

[afc163]

不要这样设置 line-height 样式，建议使用官方提供的 size。

[afc163]

另外，你想设置的可能是：

- lineHeight: 28,
+ lineHeight: "28px",

[BernardZhang]

@afc163 你有去看codesandbox 效果么？这是一个严重的bug呢，无论怎么设置不起作用无所谓，但至少不要出现功能不可用的bug吧

[BernardZhang]

@afc163 用户怎么设置 设置的不对，可以到不到期望的样式效果，这个可以理解，但是组件出现了功能性的障碍这个应该是组件的bug

[kerm1it]

@BernardZhang 原因就是因为 lineHeight 设置成了 28 而不是 28px，这两者的意义不一样的，28 代表的是当前字体大小的28倍，而不是 28px，所以导致Select的点击区域变大。

你看现在的input框跑哪去了？

[BernardZhang]

@kermit-xuan 哦 了解了，这是一个antdv3.x时的遗留代码，在3.x的时候没有问题，用工具升级antd4.x后，无意发现这个问题的，那就是4.X针对lineHeight的处理逻辑变了导致的吧

[kerm1it]

只是碰巧在v3里面 lineHeight 属性没有起作用，你把版本改到v3把 lineHeight 去掉，效果不受影响。