IE7 - 배경색이 너무 넓습니다.

Question

이미지 상단에 텍스트가 있습니다.

새 브라우저에서는 정상적으로 작동합니다. 나는 IE7에서 확인할 때

는하지만, 그것은 다음과 같습니다

은 어떻게 든, IE7은 배경색에게 100 %의 폭을주는 매우 치열하다. 그리고 텍스트의 길이가 페이지마다 다를 수 있기 때문에 폭을 설정하여 문제를 해결할 필요가 없습니다.

내 CSS는 다음과 같습니다

#sub-slideshow-wrapper h2 { 
font-family: 'Droid Sans',sans-serif; 
display: table; 
font-size: 20px; 
font-weight: 900; 
color: #000; 
background: #e68e47; 
background: rgba(230,142,71,0.8); 
padding: 7px; 
margin: 0 0 3px 0; 
} 

그리고 IE7 오래된 것을 알고, 오직 1.xxx 그것을 usnig된다. 하지만 내 모든 브라우저, 심지어 오래된 브라우저에서 작동하도록 expection입니다.

Answer 1

당신이 지원 IE7 줌 추가해야하는 경우 : 1과 * 디스플레이 : 인라인가 인라인 블록 인 것처럼 IE 7을 표시하기 위해 (별 IE6 & 7을 대상으로 해킹). 그러나 이것은 원하지 않는 다른 효과가있을 수 있습니다.

#sub-slideshow-wrapper h2 { 
font-family: 'Droid Sans',sans-serif; 

zoom: 1; /* added */ 
*display: inline; /* added */ 

display: table; 
font-size: 20px; 
font-weight: 900; 
color: #000; 
background: #e68e47; 
background: rgba(230,142,71,0.8); 
padding: 7px; 
margin: 0 0 3px 0; 
} 

Answer 2

당신이 here을 볼 수 있듯이, IE7은 display:table를 지원하지 않습니다 그래서 당신의 h2 문제의 원인 display:block (h2에 대한 표준 display)로 렌더링됩니다.

IE7의 전체 사용량이 약 0.1 %이기 때문에 그냥 그대로 두는 것이 좋습니다.