파이어 폭스 및 인터넷에서 인라인 블록 문제가 발생했습니다.

Question

저는 즉, 파이어 폭스가 인라인 블록을 표시하는 데 어려움을 겪고 있습니다. 나는 아마 내가 위의 parapgrah에 위의 단락에서 더 긴 이름을 쓸 때

<div class="cell"> 
    <div><img src="images/dftg.jpg" /></div> 
    <p>Sean val</p> 
</div> 

문제는 파이어 폭스와 IE에서 발생 .. 의도 한대로 구글 크롬이 표시되는지 지적한다. 파이어 폭스에서, 즉, 셀 div가 위로 움직이면서 레이아웃을 이상하고 일관성 없게 만든다.

.cell { 
    display: inline-block; 
    display:-moz-inline-stack; 
    border: 3px solid #ff0000; 
    padding: 7px; 
    height: 170px; 
    zoom: 1; 
    *display: inline; 
    _height: 170px; 

} 

.cell p { 
    padding: 10px 25px; 
    width: 150px; 
} 

Answer 1

vertical-align을 지정하지 않았으므로이 문제가 발생했을 수 있습니다. 이 사용

봅니다 :

.cell { 
    display: inline-block; 
    vertical-align: top; 
    border: 3px solid #ff0000; 
    padding: 7px; 
    height: 170px; 
    zoom: 1; 
    *display: inline; 
    _height: 170px; 
} 

당신은 약 display: -moz-inline-stack을 잊을 수 - 그것은 단지 매우 낮은 사용량이 파이어 폭스 2를 위해입니다. 이 vertical-align를 사용하여 언급 않는

http://blog.mozilla.com/webdev/2009/02/20/cross-browser-inline-block/

당신은 아마, 다시 읽어야

"연구를하고"동안 당신은 아마 읽은 글이 있었다.

Answer 2

읽은 기사의 날짜를 확인해야합니다. FF3 이후 인라인 블록이 지원되었습니다.

파이어 폭스 3에서 다른 주요 브라우저 (대부분)를 지원하는 다른 방식으로는 보이지는 않지만 유용한 새로운 기능이 인라인 블록입니다. 요소에 할당되면 표시 유형 인 인라인 블록은 요소가 인라인으로 배치되도록하지만 (span과 같이) 요소의 내용은 요소가 블록 인 것처럼 배치됩니다. 당신이 그것을 해결 같은

http://ajaxian.com/archives/soft-hyphens-and-inline-block-subtleties-in-firefox-3-rc-1

어쨌든, 보인다.