표 우리는 다음과 같은 페이지가 IE

에 DIV의 폭을 강요 :표 우리는 다음과 같은 페이지가 IE

<?xml version="1.0" encoding="ISO-8859-1"?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
    "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> 
    <head> 
     <meta http-equiv="Content-Type" 
      content="text/html;charset=ISO-8859-1" /> 
     <title>Welcome to Application</title> 
     <style type="text/css"> 
html, body, div, table, tr, th, td { 
    border: 0; 
    font-family: inherit; 
    font-size: 100%; 
    font-style: inherit; 
    font-weight: inherit; 
    margin: 0; 
    padding: 0; 
    vertical-align: baseline; 
} 

html { 
    font-size: 100%; 
} 

body { 
    background: #fff; 
    color: #036; 
    font-family: Verdana, sans-serif; 
    font-size: 11px; 
    line-height: 18px; 
} 

* html body { 
    text-align: center; 
} 

.container { 
    display: block; 
    margin: 18px auto 0; 
    width: 750px; 
} 

* html .container { 
    height: 1%; 
    text-align: left; 
} 

.container:after { 
    clear: both; 
    content: "\0020"; 
    display: block; 
    height: 0; 
    overflow: hidden; 
    visibility: hidden; 
} 

.section { 
    border-color: #e5e5e5 #dbdbdb #d2d2d2; 
    border-style: solid; 
    border-width: 1px; 
    margin-bottom: 18px; 
    padding: 17px 39px; 
} 

table, th, td { 
    vertical-align: middle; 
} 

th, td { 
    border-right: 1px solid #fff; 
    font-weight: 400; 
    padding: 9px; 
    text-align: left; 
} 

table { 
    border-collapse: separate; 
    border-spacing: 0; 
    margin-bottom: 1.4em; 
    width: 100%; 
} 

th { 
    background: #c3d9ff; 
    border-bottom:1px solid #ddd; 
    font-size: smaller; 
    font-weight: 700; 
} 
     </style> 
    </head> 
    <body> 
     <div class="container"> 
      <div class="section"> 
       <table cellspacing="0"> 
        <tr> 
         <th>Header</th> 
         <th>Header</th> 
         <th>Header</th> 
        </tr> 
        <tr> 
         <td>Content</td> 
         <td>1</td> 
         <td>a</td> 
        </tr> 
        <tr> 
         <td>Content</td> 
         <td>2</td> 
         <td>b</td> 
        </tr> 
        <tr> 
         <td>Content</td> 
         <td>3</td> 
         <td>c</td> 
        </tr> 
        <tr> 
         <td>Content</td> 
         <td>4</td> 
         <td>d</td> 
        </tr> 
        <tr> 
         <td>Content</td> 
         <td>5</td> 
         <td>e</td> 
        </tr> 
        <tr> 
         <td>Content</td> 
         <td>6</td> 
         <td>f</td> 
        </tr> 
       </table> 
      </div> 
     </div> 
    </body> 
</html>

div 제대로 표시 Windows XP에서 크롬과 파이어 폭스 3.6,하지만 IE6에서 볼 때,의 table입니다 div을 지정된 750 픽셀보다 넓게 설정해야합니다.

이 문제는 현재 부분적으로 명시 적으로 670 개 픽셀

에 테이블의 폭을 설정하여 해결되었습니다

우리는 여전히 테이블의 폭이 명시 적으로 필요하지 않는 해상도를 선호하는 것

는

출처

2011-05-11 purinkle

IE6에서 저에게 효과적입니다. div 너비가 증가하는 콘텐츠를 추가 할 때입니까? – lnrbob

@lnrbob, Chrome 및 IE6에서 위의 마크 업을로드하고 두 너비를 비교하면 너비가 다릅니다. – purinkle

정의

* html .section{ 
    width: 100%; 
}

: 나는 (단락 명시 적으로 .container 또는 table에 670 폭을 설정) 일 듯 http://ipinfo.info/netrenderer/에서 시뮬레이터와 한 가지를 시도했지만 내가, 내 컴퓨터에 IE6이없는

는 다음을 추가했다

나는 의 설정이 width: 100%; 일 때 .container의 너비가 750px가 아닌 .section의 계산 된 너비 (채우기 및 테두리의 영향을 받음)를 기반으로해야한다고 생각합니다.

출처

2011-05-13 14:45:56

표 우리는 다음과 같은 페이지가 IE

답변

관련 문제