0

Google 크롬에만있는 매우 이상한 버그가 있습니다. 유니 코드에서 뒤 따르는 문자로 대체 된 각 문자로 옵션 텍스트를 렌더링하는 드롭 다운 메뉴입니다. 다음은 이미지가있다 :Chrome 별난의 드롭 다운 목록 텍스트

WTF??

당신이 볼 수 있듯이, 단어 "대출" "Mpbo는"이된다.

<select class="form-control" data-val="true" data-val-number="The field LoanId must be a number." 
data-val-required="The LoanId field is required." id="LoanId" name="LoanId" 
onchange="this.form.submit();" 
style="display: inline-block; width: auto; font-size: 12px;"> 
    <option value="">Loan</option> 
    <option>1000001947</option> 
    <option>1000002123</option> 
    <option>1000003227</option> 
    <option>1000003396</option> 
</select> 

사용자 정의 CSS : :이 HTML은 간단

@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro); 
body { 
font-family: "Source Sans Pro", sans-serif; 
background-color: #ecf0f5; 
color: #646e79; 
font-size: 0.875em; 
line-height: 1.4; 
} 
select { 
padding: 0.35em 0.75em; 
height: 25px; 
line-height: 25px; 
background: #ecf0f5; 
border: 1px solid #ecf0f5; 
color: #323640; 
} 
button, input, select, textarea { 
font-size: 100%; 
margin: 0; 
vertical-align: baseline; 
} 
*, *:before, *:after { 
box-sizing: border-box; 
} 
::selection { 
background: rgba(100, 110, 121, 0.2); 
text-shadow: none; 
} 

내가 a JSFiddle을 생성하지만 크롬이 잘 작동, 그래서 난 정말이 무엇인지 모른다. 사이트는 ASP.NET MVC 5에서 Twitter Bootstrap 3.0을 사용하여 수행됩니다. 당신이 줄 수있는 도움을 주셔서 감사합니다.

+0

문자 인코딩에 문제가있을 수 있습니다. [meta charset MDN] (https://developer.mozilla.org/en-US/docs/Web/HTML/Element/meta#attr-charset) & [@ charset - CSS MDN] (https://developer.mozilla.org/en-US/docs/Web/CSS/@charset) – Givi

답변

0

이것은 우리가 사용하고있는 SVG 글꼴에 문제가있는 것으로 나타났습니다. 필자의 경우, @import 소스의 Google API는 회사 서버의 실제 글꼴 파일에 연결할 수 없기 때문에 사용했습니다. URL을 Google에 직접 연결 한 로컬 파일에 URL을 바꾼 후에는 문제가 해결되었습니다.