2013-07-01 3 views
0

IE9 및 IE10에서 작동하지 않는 이유가 없습니다. 다른 브라우저에서는 작동하지만 그 브라우저에서는 작동하지 않습니다. 나는 또한 자막 장식 홈 페이지에이 기술을 사용하고: before 요소가 잘못 위치했습니다.

s http://d.pr/i/QNwi.jpg

.briefing h3 { 
    margin-bottom: 23px; 
    border-bottom: 3px double #9f9c9b; 
    position: relative; 
    padding-bottom: 22px; 
    padding-left: 40px; 
} 

.briefing h3:before { 
    content: url('../img/general-title-decoration-white.svg?1370978950'); 
    width: 25px; 
    display: block; 
    top: 2px; 
    left: 0; 
    position: absolute; 
} 

: 여기 내 문제입니다. 그것이 작동하는 것을 제외하고이 코드를

http://d.pr/i/irsT.jpg

:

.special-title { 
    font-size: 24px; 
    color: #a4a19e; 
    line-height: 1.2; 
    position: relative; 
    padding: 8px 0 8px 38px; 
    border-top: 1px solid #e2dbcf; 
    border-bottom: 1px solid #e2dbcf; 
    margin-top: 49px; 
    margin-bottom: 25px; 
} 

.special-title:before { 
    content: url('../img/general-title-decoration.svg?1369571463'); 
    position: absolute; 
    width: 28px; 
    height: 28px; 
    left: 0; 
    top: 10px; 
} 

나는 차이를보고 시도했다하지만 난 그것을하지 않습니다.

또한 의사 요소가 IE의 내 콘솔에 나타나지 않으므로 테스트하기가 쉽지 않습니다 (특히 browserstack의 경우).

아이디어가 있으십니까? 나는 거기에 갇혀있다.

And the page where it doesn't

Here is the page where the problem appears

대단히 감사합니다. :)

+0

사이드 발언으로 인턴쉽을 찾고 있는데 내 회사 (브뤼셀)에서 종종 연수생을 받아들입니다. www.mccann.be ;-) –

+0

@Bartdude stackoverflow의 무대 제공? 내 기술을 보여줄 수있는 가장 좋은 곳인지 모르겠지만 아하. 감사합니다! 나는 이것을 체크 할 것이다 : – Naemy

+0

도움을 요청하는 것은 약점을 보이지 않는다. 나는 그들이 학교에서 바로 모든 것을 알거나 자신의 반성의 표시를 보이지 않는 척하는 사람들에 대해 더 염려 할 것입니다. –

답변

0

:before 요소 absolute을 배치하지 않으셨습니까? 정의하지 않는 한 아무리 잘 위치해야합니다. display:block;

또한 두 경우의 차이점은 첫 번째 경우에 display:block;으로 설정한다는 것입니다.

+0

코드에서 100 %로 설정된 svg이므로 display : block을 설정하지 않으면 전체 컨테이너를 차지합니다. 그래, 그냥 주목! 나는 시험하지 않을 것이다. 감사합니다 :) – Naemy

+0

죄송합니다, 그것이 SVG임을 보지 못했습니다. 행운을 빌어, 그 결과를 알려주세요. – maartenmachiels

+0

글쎄, 나는 디스플레이를 제거하려했다. 블럭과 아무것도 바뀌지 않았다. 나는 문제가 어디서 왔는지 알지 못한다. – Naemy

0

테스트 할 수 없지만 ::before을 사용해보세요. 이는 CSS3에서 새로 추가 된 것입니다.

관련 문제