Program Club

Internet Explorer 7, 6에서 인라인 블록이 작동하지 않습니다.

proclub 2020. 10. 13. 19:34
반응형

Internet Explorer 7, 6에서 인라인 블록이 작동하지 않습니다.


이 CSS 코드는 inline-block. 누구든지 Internet Explorer 6 및 7에서 작동하도록하는 방법을 알려줄 수 있습니까? 아이디어가 있습니까? 내가 뭔가 잘못하고있는 것일까? 감사합니다!

#signup {
   color:#FFF;
   border-bottom:solid 1px #444;
   text-transform:uppercase;
   text-align:center;
}
#signup #left {
   display: inline-block
}
#signup #right {
   background-image:url(images/signup.jpg);
   border-left: solid 1px #000;
   border-right: solid 1px #000;
   display: inline-block; 
   padding:1% 2%
   width:16%;
}
#signup #right a { font-size:100%; font-weight:bold } 
#signup #right p { font-size:90%; font-weight:bold }
#signup a:hover  { color:#FFF; text-decoration:underline }

IE6 / IE7에서는 자연스러운 인라인 display: inline-block요소 (예 : s) 에서만 작동합니다 .span

divs 와 같은 다른 요소에서 작동하려면 다음이 필요합니다.

#yourElement {
    display: inline-block;
    *display: inline;
    zoom: 1;
}

*display: inline"안전한"CSS 해킹을 사용하여 IE7 이하에만 적용됩니다 .

IE6 / 7의 경우 hasLayout을zoom: 1 제공합니다 . "레이아웃"을 갖는 것은 항상 작동 하기위한 전제 조건입니다 .display: inline-block

유효한 CSS를 유지하면서이 해결 방법을 적용 할 수 있지만, 특히 이미 공급 업체 접두사 속성을 사용하고있는 경우에는 고려할 가치가 없습니다.

대한 자세한 내용을 보려면 이 문서읽으십시오display: inline-block (그러나 -moz-inline-stack지금은 고대 Firefox 2에서만 필요 했던는 잊어 버려야 합니다).


*display:inlineIE7 해킹으로 잘 작동합니다 . 그러나 zoom:1코드에 *background:#fff; *display:inline; zoom:1. 여기에 배경색 코드를 입력 할 수 있습니다. 예를 들어 목록 항목이 화면에 표시되지 않는 경우와 같이 화면에 레이아웃이 표시되지 않는 경우가 있습니다. 그런 다음 이러한 경우 이것은 훌륭하게 작동하며 다른 브라우저 에서처럼 나타납니다.

참고 URL : https://stackoverflow.com/questions/5838454/inline-block-doesnt-work-in-internet-explorer-7-6

반응형