2016-08-10 7 views
1

Internet Explorer (9,10, 가장자리)의 상자 그림자와 배경 사이에 상자 그림자가있는 제목 배경에 투명 테두리가 나타납니다. 그들은 box-decoration-break: clone;를 넣어 언급하지만 Internet Explorer를 지원하지 않는 일부 스택 오버플로 답변에서CSS3 - 투명 그림자가 Internet Explorer의 여러 줄 제목에 대해 상자 그림자에 나타납니다.

background: rgb(130, 210, 250); 
box-shadow: 10px 0px 0px #82d2fa, -10px 0px 0px #82d2fa; 

:

Please check Image

는 내가 추가 한 스타일입니다. 해결 방법이 있습니까?

아래 링크를 참조하시기 바랍니다 : http://jsfiddle.net/verber/WmRT3/

답변

1

.title { 
    font: 20px/1.25 Ubuntu, sans-serif; 
    text-transform: uppercase; 
    margin-bottom: 1rem; 
    line-height: 45px; 
    display: inline-block; 
    width: 300px; 
} 
.title .highlight { 
    display: inline; 
    background: #ee4035; 
    color: white; 
    padding: 0.5rem; 
    padding-left: 0; 
    padding-right: 10px; 
    white-space:pre-wrap; 
} 
.title.step-1 .highlight { 
    box-shadow: -10px 0 0 #ee4035,-10px 0 0 #ee4035; 
} 
시도