IE8頁腳問題

Question

爲什麼我的頁腳IE8不顯示完整 頁面寬度：

顯示：

http://cl.ly/0J2Z0l1w3S1e0A3d3Q1V

HTML： <footer> content </footer

/*Reset */ 
html, body, #wrapper, #main h1, h2, h3, h4, h5, h6, form, input, ul, ol, p, fieldset { padding: 0; margin: 0; } 

/* Main CSS */ 
html, body,#wrapper{ 

    width:990px; 
    height:100%; 
    min-height:100%; 
    margin: 0 auto; 
} 

#wrapper{ 
    position: absolute; 
} 
#header{ 
    position:relative z-index:500; 
    background:url('../images/header.png'); 
    width:990px; 
    height:220px; 
} 

/*Menu */ 
nav{ 
    float:left; 
    width:190px; 
    margin:0 0 0 0; 
} 

nav ul{ 
    float:left; 
    margin:0; 
    list-style:none; 
    font-size:14px; 
    width:190px; 
} 

nav li a{ 
    font-size:14px; 
    color:#fff; 
    line-height:25px; /*Text Hight On Button */ 
    text-decoration:none; 
    text-indent:25px; 
    display:block; 
    width:190px; 
    height:27px; 
    background-image:url('../images/normal.png'); 
} 

nav a:hover{ 
    background-image:url('../images/onclick.png'); 
} 

/*Content */ 

#content{ 
    margin: 0 0 0 190px; 
    background:url('../images/mainbg.png') no-repeat; 
    width:815px; 
    height:555px; 
} 

#content h1{ 
    margin: 5px 0 0 10px; 
    font-family: 'Josefin Slab', arial, serif; 
    font-size:24px; 
} 

#content p{ 
    margin:0 0 0 15px; 
} 

#content li{ 
    margin:0 0 0 35px; 
} 

.clear{ 
    clear:both; 
    margin:0; 
    padding:0; 
} 

footer{ 
    clear:both; 
    overflow:hidden; 
    bottom:0; 
    background:url('../images/footer.png') no-repeat #000; 
    width:100%; 
    height:20px; 
    border: 6px solid pink; 
} 

/* Misc*/ 

#metal{ 
    float:left; 
    margin:160px 0 0 -190px; 
    background:url('../images/metalnavbg.png'); 
    height:400px; 
    width:190px; 
} 

/* Text Formatting */ 

#companyName{ 
    text-align:center; 
    padding-top:45px; 
    font-size:35px; 
    color:#f0f0ef; 
} 

#companyQuote{ 
    text-align:center; 
    font-size:18px; 
    color:#a5a4a2; 
} 

/*Forms */ 

/*General*/ 

#validation{ 
    font-weight:bold; 
    color:#ff0101; 
} 
.contactForm{ 
    width: 450px; 
    height:425px; 
    padding: 15px 25px; 
    margin: 0 auto 10px; 
    color: #000; 
    -moz-border-radius:15px; 
    -webkit-border-radius:15px; 
    overflow: hidden; 
} 

#validation{ 
    font-weight:bold; 
    color:#ff0101; 
} 

.form{ 
    width: 400px; 
    height:100%; 
    padding: 15px 25px; 
    margin: 0 auto 10px; 
    color: #000; 
    -moz-border-radius:15px; 
    -webkit-border-radius:15px; 
    overflow: hidden; 

} 

.borderradius.form{ 
    width: 400px; 
    height:100%; 
    padding: 15px 25px; 
    margin: 0 auto 10px; 
    color: #000; 
    -moz-border-radius:15px; 
    -webkit-border-radius:15px; 
    overflow: hidden; 
} 

fieldset{ 
    border:none; 
} 

#formLayout{ 
    border:2px solid #000; 
} 

#formLayout label{ 
    clear: both; 
    display: block; 
} 

#formLayout input{ 
    font-size:12px; 
    border: 2px solid #999; 
    padding: 6px 8px; 
    background-color: #fff; 
    -moz-border-radius:10px; 
    -webkit-border-radius:10px; 
    -webkit-box-shadow: inset 0px 2px 2px rgba(0,0,0,0.2); 
    -moz-box-shadow: inset 0px 2px 2px rgba(0,0,0,0.2); 
    color: #000; 
    width: 250px; 
} 



#formLayout .small{ 
    color:#ff0101; 
    display:block; 
    font-size:11px; 
    font-weight:bold; 
    text-align:left; 
    width:140px; 
} 

#formLayout textarea{ 
    width:250px; 
} 

#error{ 

    width:250px; 
    height:20px; 
    margin:-30px 0 0 270px; 
    padding-bottom:10px; 
} 

#error p{ 
    color:#ff0101; 
    text-align:left; 
} 

/* Specific Form Class's */ 

.login{ 
    width: 470px; 
    height:250px; 
    padding: 15px 25px; 
    margin: 0 auto 10px; 
    color: #000; 
    -moz-border-radius:15px; 
    -webkit-border-radius:15px; 
    overflow: hidden; 

} 

.login label{ 
    font-weight:bold; 
} 
.login .loginSubmit{ 
     margin-top:25px; 
} 
/*Gallery CSS */ 


#gallery{ 
    width:120px; 
    margin-left:5px; 
    display: inline; 
} 

#gallery .thumbnail{ 
    margin:0 auto; 
    display:inline; 
} 

#gallery img{ 
    margin:5px; 
} 

#sales{ 
    width:190px; 
    height:195px; 
    margin-left:15px; 
    display:inline-block; 
    border: 1px solid red; 
} 


#sales .location{ 
    float:left; 
    text-align:center; 
    font-weight:bold; 
    margin-left:15px; 
} 

#sales .price{ 
    float:left; 
    text-align:left; 
    font-weight:bold; 
    padding-left:5px; 
    color:#ff0101; 
} 

Answer 1

我已經通過我的浮footerdiv向左

Answer 2

如果你是usin g <footer>（花式schmancy HTML5標籤）有時IE不喜歡它。這是我解決這個問題的方法。添加到您的<head>：

<script>document.createElement('footer');</script>

這可能不是什麼造成您的問題，而是嘗試使用HTML5標籤當我通知，IE幾乎忽略它們或奇怪使他們。

Answer 3

將顯示：塊添加到您的頁腳標記。 其實所有花式schmancy HTML5標籤應該成立。

/* HTML5 block-level reset for enhanced structural tag support in older browsers */ 
header, footer, section, aside, nav, article, figure { display: block; padding: 0; margin: 0; } 

Answer 4

下載Modernizr，並把這個腳本的HTML網站的負責人解決了這個問題。基本上這個腳本將爲瀏覽器註冊所有的HTML5元素。因此，IE不會破壞更多未知的元素。