2014-10-20 3 views
2

IE11을 사용하지만 솔루션 IE9 +를 찾고 있는데, 이유를 디버깅합니다. the labels at the bottom of this CSS bar chart are improperly positioned.IE는 절대 위치 지정을 무시합니다. :: 전에

.chart span::before { 
    position: absolute; 
    left: 0; 
    right: 0; 
    top: 100%; 
다음 position:absolute 이상하게 배치 라벨의 결과로, ::before 의사에 적용되지 않는 - 명확한 폭과 높이를 갖는 상대 부모 컨테이너에도 불구하고 - 나는 IE 디버거 무엇을 말할 수에서

Chrome, FF 등 모든 것이 정상입니다. 레이블이 예상대로 가로 막 대형 차트 아래에 있습니다. 이 문제가 발생하는 이유에 대한 통찰력이나 IE에서 디버깅에 대한 팁 (이전에는 Chrome 및 FF에서 할 수있는 것과 같은 대상을 찾을 수 없습니다)은 무엇입니까?

답변

1

::before 유사 요소의 top:100%bottom:-21px으로 바꾸어보세요. FF, Chrome 및 IE9 +에서 작동하는 것으로 보입니다.

Demo

+0

징고로! 당신은 (교육받은) '최고'가 문제 였다고 생각 했나요? 아니면 IE에서 디버깅을 했습니까? 그렇다면 IE와 Chrome 및 Firefox를 디버깅하는 방법이 있습니까? (즉,':: before'은 DOM에서 검사 할 수있는 실제 요소가 적용된 셀렉터와 분리되어 있습니다.) – bishop

+0

@bishop 100 %가 다른 브라우저에서 21px와 같은지 아닌지 질문합니다. 그것은 작동하지만 해결책은 아닙니다. – Rob

+0

IE에서 실제 pseudo 요소를 검사하고 강조 표시하는 방법을 모르므로 스팬을 검사하여 DOM의 스타일 창에서':: before' 스타일을보고 피딩 할 수 있습니다 탐침". – Talmid

관련 문제