Chrome:在选择中使用非默认字体粗细时,文本会被切断

时间:2016-10-14 15:21:12

标签: css google-chrome select webkit-appearance

当您在font-weight的{​​{1}}上使用非默认select时,文字似乎会被切断。

enter image description here

http://jsbin.com/wediwoqara/1/edit?html,css,output

CSS:

Google Chrome

HTML

select{
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding: 0 10px;
  height: 30px;
  border: 1px solid #ccc;
  border-radius: 0;
  background-color: #fff;
}

.broken {
  font-weight: 700;
}

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width"> <title>JS Bin</title> </head> <body> <select class="broken"> <option>Markets Served</option> </select> <select class="works"> <option>Markets Served</option> </select> </body> </html> 版本:

  • Google Chrome Version 53.0.2785.143 (64-bit)
  • OS X (10.11.4) Version 54.0.2840.59 (64-bit)

据我所知,这是一个错误?如果有任何我没有看到的解决方案,我会感兴趣。

0 个答案:

没有答案