IE9

이 같은 크롬에서 잘 표시 CSS 이하로 사용하여 형상을 만든

에 CSS를 사용하여 만든이 화살표 모양을 수정하는 방법 : enter image description here IE9

을하지만이 같은 IE9에서 깨진 나타납니다 :

enter image description here

어떻게 수정합니까? 여기에 제 css/html이 생성에 사용됩니다.

<html> 
<style> 
.arrow-head{ 
    width: 0px; 
    height: 0px; 
    border-top: 10px solid transparent; 
    border-bottom: 10px solid transparent; 
    border-left:10px solid blue; 
    float:left; 
} 
.arrow-mid{ 
    background:blue; 
    height:20px; 
    width:80px; 
    font-size:12px; 
    color:white; 
    text-align:center; 
    float:left; 
} 
.arrow-tail{ 
    width: 0px; 
    height: 0px; 
    border-top: 10px solid blue; 
    border-bottom: 10px solid blue; 
    border-left:10px solid transparent; 
    float:left; 
} 
</style> 
<body> 
<div class="arrow-tail"></div><div class="arrow-mid"></div><div class="arrow-head"></div> 
</body> 
</html>

출처

2014-01-28 Pranalee

IE9의 ** IE ** 모드 **에서 작동하는 것으로 보인다. –

왜 downvote? 어떤 코멘트? – Pranalee

나는 downvoted 누가 아니 었어. –

개발자 도구를 사용하여 IE9를 사용했으며 완벽하게 작동하는 것으로 보입니다. 아래 meta를 사용하고이 아니라 (이

<meta http-equiv="X-UA-Compatible" content="IE=edge">

Demo작동합니다 볼 ...

을
는 개발자 도구를 엉망으로 추측하고 난 당신이 IE8 표준보기가 켜져 있다고 가정 OP는 IE9 표준 모드에서 코드가 완벽하게 실행됨에 따라)

출처

2014-01-28 11:35:19

제게는 위의 메타 태그를 추가 할 때만 작동합니다. – Pranalee

@Pranalee 8 표준 모드가 실행 중이므로 –

답변

관련 문제