Html 页脚和径向渐变不适用于IE_Html_Internet Explorer_Css

Html 页脚和径向渐变不适用于IE

html internet-explorer css

Html 页脚和径向渐变不适用于IE,html,internet-explorer,css,Html,Internet Explorer,Css,我正在做一个学校的项目，我们必须建立一个假网站来提供住宿和早餐。这里是链接。如果你在Google Chrome中查看站点，它运行良好，但是如果你在新IE中查看站点，你可以看到页脚重叠在底部的文本上，径向渐变不是径向的，而是线性的。如何解决这个问题请在新的IE和Chrome中查看该站点，以便您可以看到差异这是主页的代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> &l

我正在做一个学校的项目，我们必须建立一个假网站来提供住宿和早餐。这里是链接。如果你在Google Chrome中查看站点，它运行良好，但是如果你在新IE中查看站点，你可以看到页脚重叠在底部的文本上，径向渐变不是径向的，而是线性的。如何解决这个问题请在新的IE和Chrome中查看该站点，以便您可以看到差异

这是主页的代码

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>
B & B Willow Lake | Home
</title>
<link rel="stylesheet" type="text/css" href="styles/layout.css">
<link rel="stylesheet" type="text/css" href="styles/style.css">
</head>
<body>
<div id="wrapper">
<header id="header">
<h1><a href="index.php"><font color="#FFFFFF">B & B Willow Lake</font></a></h1>
</header>
<ul id="menu">
<li>
<a href="packages.php">Packages</a>
<ul>  
<li><a href="one_and_two_night.php">One and Two Night</a>
</li>
<li><a href="anniversary.php">Anniversary</a>
</li>
<li><a href="extended_stay.php">Extended Stay</a>
</li>
<li><a href="honey_moon.php">Honey Moon</a>
</li>
</ul>
</li>
<li><a href="activities.php">Activities</a>
<ul>
<li><a href="indoor.php">Indoor</a>
</li>
<li><a href="outdoor.php">Outdoor</a>
</li>
</ul>
</li>
<li><a href="dine.php">Dine</a>
<ul>
<li><a href="specials.php">Specials</a>
</li>
<li><a href="breakfast.php">BreakFast</a>
</li>
<li><a href="lunch.php">Lunch</a>
</li>
<li><a href="teaparty.php">Tea Party</a>
</li>
</ul>
</li>
<li><a href="contact_us.php">Contact Us</a>
<ul>
<li><a href="directions.php">Directions</a>
</li>
</ul>
</li>
</ul>
<section id="section_slide">
<img src="images/background.jpg" alt="background" id="png1"><img src="images/background3.jpg" alt="background2" id="png3"><img src="images/background2.jpg" alt="background3" id="png2"><img src="images/background4.jpg" alt="background4" id="png4">
</section>
<div id="middle_wrapper">
<section id="section">
<article>
<h2>Play</h2>
<a href="play.html"><img src="images/play.jpg" id="png5" alt="background5" id="picmain"></a>
<p>Here will go a text area that talks about all the stuff they can do out door and in door most of the descrpiton will be like the descrpition on the acrives page which it is refing to,<br />
<a id="learnmore" href="play.php">Learn More</a>
</p></article><hr /> 
<article>
<h2>Stay</h2><a href="stay.php"><img src="images/stay.jpg" id="png6" alt="background6" id="picmain2"></a>
<p>This wil be a ref to the package page just a shorter descrpiton so sum up what our stay is like all of these little text areas like play stay dine and cel shoul have a blue text area at the bottom that says learn more that when liked should link to the main page for the subject.<br />
<a id="learnmore2" href="stay.php">Learn More</a>
</p><hr /></article>
<article>
<h2>Dine</h2><a href="dine.php"><img src="images/dine.jpg" id="png7" alt="background7" id="picmain3"></a>
<p>Here will be a desc of the dine page which well tell the user the basics of what eating is like at the resort b and b willow lake it should also tell them that there is a kids menu for there kids and that there is fine dining for the adults and a lot of places to eat for the famlily and just for lovers to get away and eat.<br />
<a id="learnmore3" href="dine.php">Learn More</a>
</p><hr /></article>
<article>
<h2>Celebrate</h2><a href="cel.php"><img src="images/cel.jpg" id="png8" alt="background8" id="picmain4"></a>
<p>This well talk about the events that you can host and the resort like wewdings and birth days tea partys any thing from normal kids birth day partys to highclass wedingns and events of any sort.<br />
<a id="learnmore4" href="celebrate.php">Learn More</a>
</p></article>
</section>
<aside id="aside">
<br />
<br />
<pre>
<form target="paypal" action="https://www.paypal.com/cgi-bin/webscr" method="post" >
<input type="hidden" name="cmd" value="_s-xclick">
<table>
<tr><td><input type="hidden" name="on0" value="Packages">Packages</td></tr><tr><td><select name="os0">
    <option value="One and Two Night">One and Two Night $1,000.00 USD</option>
    <option value="Anniversary">Anniversary $1,000.00 USD</option>
    <option value="Extended Stay">Extended Stay $1,000.00 USD</option>
    <option value="Honey Moon">Honey Moon $1,000.00 USD</option>
</select> </td></tr>
</table>
<input type="hidden" name="currency_code" value="USD">
<input type="hidden" name="encrypted" value="-----BEGIN PKCS7-----MIIIQQYJKoZIhvcNAQcEoIIIMjCCCC4CAQExggEwMIIBLAIBADCBlDCBjjELMAkGA1UEBhMCVVMxCzAJBgNVBAgTAkNBMRYwFAYDVQQHEw1Nb3VudGFpbiBWaWV3MRQwEgYDVQQKEwtQYXlQYWwgSW5jLjETMBEGA1UECxQKbGl2ZV9jZXJ0czERMA8GA1UEAxQIbGl2ZV9hcGkxHDAaBgkqhkiG9w0BCQEWDXJlQHBheXBhbC5jb20CAQAwDQYJKoZIhvcNAQEBBQAEgYAMs9r2YG9I7ikzCDRIZqc64nR7wAd2EBIWaIKjbAcQUTp4AueD6i7L4t9AWswvItQPT7rK69SZLWJfPwVAPDXm76ceQ+AU+q1BmIhD5aYa3eyPnyXhlsI3729mpCh3Dw0X6pkg1kBWPdtRO4h6OEEZhZ53Vj6pkpSNYag0L5SZZTELMAkGBSsOAwIaBQAwggG9BgkqhkiG9w0BBwEwFAYIKoZIhvcNAwcECJD929txeFAagIIBmIA8gAI8OxJHVsUUrxbf6a+5gqoMJ2QNN9zZwBOnkn2XD9EVCLGoFg2X4y83o7s2AfI1fXggBIq07Gl9f2liBAMJ1SPJCtKrcxnY+ZNNk0ktV5FklNQmXsMHHvn/+okYe5ooSDKxn/O+BGm3P+ReaxdWhKSe4p0lSU2rApjnyhYacLcOiWAqnhKwXzFitUloM8FO1koFBypKkx+laE62z7lbEmVnXVgn2k32vu4HR/akIDfj/Uz/oOYQnDFyP9NcWZiH/cwLfq+wOrVqBv0C64hZH2I2Q8uErbtSPFnmCcAKcNOciDAat926O1SmloHMbkmZHNRgwXv0fIAwlR+5DXRyeVvriJUCaLHZxKOxR93bJ8QE27J5U7jdkS3eZ0jHplCi8ahJRNSwZUPS999ldBPRGS4NGT4cHCZ2+nydhIAbycZOG+IJTWWgq3v758c3iTmPCB3XzZatuQb1K3/BK7srpFIk+anT17XzfyjbVr9Om7ZduFAZQSbOZtsvtdDNRk0q/Nc7rRGSz8BpdlQ9QPObrnOLVhp6zqCCA4cwggODMIIC7KADAgECAgEAMA0GCSqGSIb3DQEBBQUAMIGOMQswCQYDVQQGEwJVUzELMAkGA1UECBMCQ0ExFjAUBgNVBAcTDU1vdW50YWluIFZpZXcxFDASBgNVBAoTC1BheVBhbCBJbmMuMRMwEQYDVQQLFApsaXZlX2NlcnRzMREwDwYDVQQDFAhsaXZlX2FwaTEcMBoGCSqGSIb3DQEJARYNcmVAcGF5cGFsLmNvbTAeFw0wNDAyMTMxMDEzMTVaFw0zNTAyMTMxMDEzMTVaMIGOMQswCQYDVQQGEwJVUzELMAkGA1UECBMCQ0ExFjAUBgNVBAcTDU1vdW50YWluIFZpZXcxFDASBgNVBAoTC1BheVBhbCBJbmMuMRMwEQYDVQQLFApsaXZlX2NlcnRzMREwDwYDVQQDFAhsaXZlX2FwaTEcMBoGCSqGSIb3DQEJARYNcmVAcGF5cGFsLmNvbTCBnzANBgkqhkiG9w0BAQEFAAOBjQAwgYkCgYEAwUdO3fxEzEtcnI7ZKZL412XvZPugoni7i7D7prCe0AtaHTc97CYgm7NsAtJyxNLixmhLV8pyIEaiHXWAh8fPKW+R017+EmXrr9EaquPmsVvTywAAE1PMNOKqo2kl4Gxiz9zZqIajOm1fZGWcGS0f5JQ2kBqNbvbg2/Za+GJ/qwUCAwEAAaOB7jCB6zAdBgNVHQ4EFgQUlp98u8ZvF71ZP1LXChvsENZklGswgbsGA1UdIwSBszCBsIAUlp98u8ZvF71ZP1LXChvsENZklGuhgZSkgZEwgY4xCzAJBgNVBAYTAlVTMQswCQYDVQQIEwJDQTEWMBQGA1UEBxMNTW91bnRhaW4gVmlldzEUMBIGA1UEChMLUGF5UGFsIEluYy4xEzARBgNVBAsUCmxpdmVfY2VydHMxETAPBgNVBAMUCGxpdmVfYXBpMRwwGgYJKoZIhvcNAQkBFg1yZUBwYXlwYWwuY29tggEAMAwGA1UdEwQFMAMBAf8wDQYJKoZIhvcNAQEFBQADgYEAgV86VpqAWuXvX6Oro4qJ1tYVIT5DgWpE692Ag422H7yRIr/9j/iKG4Thia/Oflx4TdL+IFJBAyPK9v6zZNZtBgPBynXb048hsP16l2vi0k5Q2JKiPDsEfBhGI+HnxLXEaUWAcVfCsQFvd2A1sxRr67ip5y2wwBelUecP3AjJ+YcxggGaMIIBlgIBATCBlDCBjjELMAkGA1UEBhMCVVMxCzAJBgNVBAgTAkNBMRYwFAYDVQQHEw1Nb3VudGFpbiBWaWV3MRQwEgYDVQQKEwtQYXlQYWwgSW5jLjETMBEGA1UECxQKbGl2ZV9jZXJ0czERMA8GA1UEAxQIbGl2ZV9hcGkxHDAaBgkqhkiG9w0BCQEWDXJlQHBheXBhbC5jb20CAQAwCQYFKw4DAhoFAKBdMBgGCSqGSIb3DQEJAzELBgkqhkiG9w0BBwEwHAYJKoZIhvcNAQkFMQ8XDTEzMTIwNjE2MjA0NlowIwYJKoZIhvcNAQkEMRYEFErtGk2xl99fwZ24pPz27NZpLG8tMA0GCSqGSIb3DQEBAQUABIGAQEb9dpBzufCv6Pbrj+PPl92ejRaBVMVJg0Xymz1sWhbP06l4Odc35NDgKse5NZ1ynxBVRstgadAstk8xAY/notAT1L5xPl7KOjVFDe3O4T0fPenM0GnoJqkI2p24zYDY9TrF8S8Xs21hnjqzDUZH2LcFoIHBjLhYSIAJcRRAEBQ=-----END PKCS7-----
">
<input type="image" src="https://www.paypalobjects.com/en_US/i/btn/btn_cart_LG.gif" border="0" name="submit" alt="PayPal - The safer, easier way to pay online!">
<img alt="" border="0" src="https://www.paypalobjects.com/en_US/i/scr/pixel.gif" width="1" height="1">
</form>

<br />
<br />
<br />
</pre>
<h2>Why Us?</h2>
<p>
<pre>
adsfsdafasdfadfsdafasfsdafasdfa<br />dfsdafadfdddddddujhyjbddddddd<br />dddddddddddddddddddddddd<br />
asdfasdfsdafadsdfasdfdsfadsfasdfa<br />dfadsfasdfadfda<br />sfasdfasdfasdfasdfsdafsdafdsafd<br />
dsasdfdsfsdfasdfasdfdfddddddddddddd<br />ddddddddddddddddddddddddd<br />dddddddddddd<br />
dddddddddddddddddddddddddddddddddd<br />Sddddddddddddddddddddddddd<br />ddddddddddddddd<br />
</pre>
</p>
<br />
<br />
<br />
<iframe title="Youtube video player" width="90%" height="390px" src="http://www.youtube.com/watch?v=mI6aVSzZsps&list=TLctir32a34lOmJXkxNcviVk5lubS_IL3N"></iframe><br />
<a href="http://www.facebook.com/"><img src="images/facebook.gif" alt="facebook" id="facebook"></a><a href="http://www.twitter.com/"><img src="images/twitter.gif" alt="twitter" id="twitter"></a><a href="http://www.google.com/"><img src="images/g+.gif" alt="g+" id="google"></a><a href="http://www.youtube.com/"><img src="images/youtube.gif" alt="youtube" id="youtube"><br /></a>
</aside>
</div>
</div>
<footer id="footer">
<h1><a href="index.php"><font color="#FFFFFF">B & B Willow Lake</font></a></h1>
<p>
bandbwillowlake@gmail.com
</p>
<p>
</p>
</footer>
</body>
</html>

这里是布局css页面

我会尝试css3pie，它是CSS3ProgressiveInternetExplorer，一个帮助IE呈现CSS3的插件

这实际上似乎是浮动html元素的问题。您的

包含的元素是

float:left。当您浮动一个元素时，它的父元素不会自动展开以包含任何浮动的子元素。为此，您需要清除浮动元素
阅读，它解释了浮动背后的理论，以及如何更详细地清除浮动
此外，IE8和IE9不支持CSS渐变。IE10和IE11确实支持它们。对于IE9，可以改用SVG背景图像
 您正在测试哪个版本的Internet Explorer？IE8/9不支持CSS渐变。IE10/11显然支持他们。对于IE9，您可以使用SVG背景图像。您的径向渐变是径向的，在IE10中也不是线性的。问题是你的身体只有302px的高度，所以它会在水平方向重复（这在Chrome中是不会发生的）。我不知道为什么身体有这么高，只是有很多代码需要处理。你知道如何制作简化的测试用例吗？啊，这是#wrapper
中的浮动-你只需要在#wrapper
元素上添加溢出：隐藏
，这就解决了这两个问题；在所有带浮动的div中：左；几乎：）您需要一个
和清除：两者都有在浮动div之后，或链接文章“清除浮动的技术”部分中的其他方法之一。溢出方法可能是最简单的。
*{
font-family:Verdana;
}
body {  
background: -webkit-radial-gradient(#D8D8D8, #A4A4A4, #6E6E6E); /* Safari */
background: -o-radial-gradient(#D8D8D8, #A4A4A4, #6E6E6E); /* For Opera 11.1 to 12.0 */
background: -moz-radial-gradient(#D8D8D8, #A4A4A4, #6E6E6E); /* For Firefox 3.6 to 15 */
background: radial-gradient(#D8D8D8, #A4A4A4, #6E6E6E); /* Standard syntax */
}
pre {
    overflow-x: auto; /* Use horizontal scroller if needed */
    white-space: pre-wrap; /* css-3 */
    white-space: -moz-pre-wrap !important; /* Mozilla, since 1999 */
    word-wrap: break-word; /* Internet Explorer 5.5+ */
    white-space : normal;
}  
#header{
color: #FFF;
background: #111;
background: -moz-linear-gradient(#5882FA, #3D72A4); 
background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #5882FA),color-stop(1, #3D72A4));    background: -webkit-linear-gradient(#5882FA, #3D72A4);  
background: -o-linear-gradient(#5882FA, #3D72A4);
background: -ms-linear-gradient(#5882FA, #3D72A4);
background: linear-gradient(#5882FA, #3D72A4);
}
#facebook{
width:50px;
height:50PX;
margin-left:5px;
}
#twitter{
width:50px;
height:50PX;
margin-left:5px;
}
#google{
width:50px;
height:50PX;
margin-left:5px;
}
#youtube{
width:50px;
height:50PX;
margin-left:5px;
}
#picmain{
text-align:center;
width:150px;
height:150px;
}
#picmain2{
text-align:center;
width:150px;
height:150px;
}
#picmain3{
text-align:center;
width:150px;
height:150px;
}
#picmain4{
text-align:center;
width:150px;
height:150px;
}

h1{
color: #FFF;
text-shadow: 0 1px 0 #000;
text-decoration:none;
}
h1 a{
text-decoration: none;
color: #FFF;
}
h2{
color: #000;
margin-bottom:8px;
text-shadow: 0 1px 0 #000;
}
#nav{
background-color: #254159;
color: #FFFFFF;
text-align: center;
}
a{
text-decoration:none;
}
a:link{
text-decoration: none;
}
a:hover{
text-decoration: underline;
}
#section_slide{
background-color: #FFFFFF;
}
img{
}
#section{
background-color: #FFF;
}
#png1{
width:25%;
height:150px;
}
#png2{
width:25%;
height:150px;
}
#png3{
width:25%;
height:150px;
}
#png4{
width:25%;
height:150px;
}
#png5{
width:150px;
height:150px;
transition:width 2s, height 2s, transform 2s;
-webkit-transition:width 2s, height 2s, -webkit-transform 2s; /* Safari */
}
#png5:hover{
width:250px;
height:250px;
transform:rotate(360deg);
-webkit-transform:rotate(360deg); /* Safari */
}
#png6{
width:150px;
height:150px;
transition:width 2s, height 2s, transform 2s;
-webkit-transition:width 2s, height 2s, -webkit-transform 2s; /* Safari */
}
#button{
width:auto;
height:25px;
background: #111;
background: -moz-linear-gradient(#444, #111); 
background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #111),color-stop(1, #444));  background: -webkit-linear-gradient(#444, #111);    
background: -o-linear-gradient(#444, #111);
background: -ms-linear-gradient(#444, #111);
background: linear-gradient(#444, #111);
color:#FFF;
}
#png6:hover{
width:250px;
height:250px;
transform:rotate(360deg);
-webkit-transform:rotate(360deg); /* Safari */
}
img{
border: none;
}
hr{
background: #111;
background: -moz-linear-gradient(#444, #111); 
background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #111),color-stop(1, #444));  background: -webkit-linear-gradient(#444, #111);    
background: -o-linear-gradient(#444, #111);
background: -ms-linear-gradient(#444, #111);
background: linear-gradient(#444, #111);
height: 1px;
-moz-box-shadow: 0 2px 1px #9c9c9c;
-webkit-box-shadow: 0 2px 1px #9c9c9c;
box-shadow: 0 2px 1px #9c9c9c;  
}
#png7{
width:150px;
height:150px;
transition:width 2s, height 2s, transform 2s;
-webkit-transition:width 2s, height 2s, -webkit-transform 2s; /* Safari */
}
#png7:hover{
width:250px;
height:250px;
transform:rotate(360deg);
-webkit-transform:rotate(360deg); /* Safari */
}
#png8{
width:150px;
height:150px;
transition:width 2s, height 2s, transform 2s;
-webkit-transition:width 2s, height 2s, -webkit-transform 2s; /* Safari */
}
#png8:hover{
width:250px;
height:250px;
transform:rotate(360deg);
-webkit-transform:rotate(360deg); /* Safari */
}
#aside{
background: #111;
background: -moz-linear-gradient(#5882FA, #3D72A4); 
background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #5882FA),color-stop(1, #3D72A4));    background: -webkit-linear-gradient(#5882FA, #3D72A4);  
background: -o-linear-gradient(#5882FA, #3D72A4);
background: -ms-linear-gradient(#5882FA, #3D72A4);
background: linear-gradient(#5882FA, #3D72A4);
}
#footer{
background: #111;
background: -moz-linear-gradient(#444, #111); 
background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #111),color-stop(1, #444));  background: -webkit-linear-gradient(#444, #111);    
background: -o-linear-gradient(#444, #111);
background: -ms-linear-gradient(#444, #111);
background: linear-gradient(#444, #111);
color:#FFFFFF;
}
#menu{
width: 82%;
margin-left: auto;
margin-right: auto;
padding: 10px 0 0 0;
list-style: none;  
background: #111;
background: -moz-linear-gradient(#444, #111); 
background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #111),color-stop(1, #444));  background: -webkit-linear-gradient(#444, #111);    
background: -o-linear-gradient(#444, #111);
background: -ms-linear-gradient(#444, #111);
background: linear-gradient(#444, #111);
-moz-box-shadow: 0 2px 1px #9c9c9c;
-webkit-box-shadow: 0 2px 1px #9c9c9c;
box-shadow: 0 2px 1px #9c9c9c;
}

#menu li{
float: left;
padding: 0 0 10px 0;
position: relative;
}

#menu a{
float: left;
height: 25px;
padding: 0 25px;
color: #999;
text-transform: uppercase;
font: bold 12px/25px Arial, Helvetica;
text-decoration: none;
text-shadow: 0 1px 0 #000;
}

#menu li:hover > a{
color: #FFF;
}

*html #menu li a:hover{ /* IE6 */
color: #FFFFFF;
}

#menu li:hover > ul{
display: block;
}

/* Sub-menu */

#menu ul{
list-style: none;
margin: 0;
padding: 0;    
display: none;
position: absolute;
top: 35px;
left: 0;
z-index: 99999;    
background: #FFFFFF;
background: -moz-linear-gradient(#444, #111);
background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #111),color-stop(1, #444));
background: -webkit-linear-gradient(#444, #111);    
background: -o-linear-gradient(#444, #111); 
background: -ms-linear-gradient(#444, #111);    
background: linear-gradient(#444, #111);    
}

#menu ul li{
float: none;
margin: 0;
padding: 0;
display: block;  
-moz-box-shadow: 0 1px 0 #111111, 0 2px 0 #777777;
-webkit-box-shadow: 0 1px 0 #111111, 0 2px 0 #777777;
box-shadow: 0 1px 0 #111111, 0 2px 0 #777777;
}

#menu ul li:last-child{   
-moz-box-shadow: none;
-webkit-box-shadow: none;
box-shadow: none;    
}

#menu ul a{    
padding: 10px;
height: auto;
line-height: 1;
display: block;
white-space: nowrap;
float: none;
text-transform: none;
}

*html #menu ul a{ /* IE6 */   
height: 10px;
width: 150px;
}

*:first-child+html #menu ul a{ /* IE7 */    
height: 10px;
width: 150px;
}

.button{
background-color:red;
}

#menu ul a:hover{
background: #111;
background: -moz-linear-gradient(#5882FA, #3D72A4); 
background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #5882FA),color-stop(1, #3D72A4));    background: -webkit-linear-gradient(#5882FA, #3D72A4);  
background: -o-linear-gradient(#5882FA, #3D72A4);
background: -ms-linear-gradient(#5882FA, #3D72A4);
background: linear-gradient(#5882FA, #3D72A4);
}

#menu ul li:first-child a{
}

#menu ul li:first-child a:after{
content: '';
position: absolute;
left: 30px;
top: -8px;
width: 0;
height: 0;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-bottom: 8px solid #444;
}

#menu ul li:first-child a:hover:after{
border-bottom-color: #FFF;
}

#menu ul li:last-child a{
}

/* Clear floated elements */
#menu:after{
visibility: hidden;
display: block;
font-size: 0;
content: " ";
clear: both;
height: 0;
}

#learnmore{
color: blue;
}

#learnmore2{
color: blue;
}

#learnmore3{
color: blue;
}

#learnmore4{
color: blue;
}
* html #menu             { zoom: 1; } /* IE6 */
*:first-child+html #menu { zoom: 1; } /* IE7 */

*{
margin: 0px;
padding: 0px;
}
#wrapper{
width: 82%;
height: auto;
margin-left: auto;
margin-right: auto;
}
#header{
width: 82%;
height: 75px;
margin-left: auto;
margin-right: auto;
}
#nav{
width: 82%;
height: 32px;
margin-left: auto;
margin-right: auto;
}
#section_slide{
width: 82%;
height: 150px;
margin-left: auto;
margin-right: auto;
}
#middle_wrapper{
width: 82%;
height:auto;
margin-left: auto;
margin-right: auto;
}
#section{
width: 56%;
height:auto;
padding: 2%;
float: left;
margin-bottom:150px;
}
#aside{
width: 36%;
height:auto;
padding: 2%;
float: left;
}
#footer{
width: 100%;
height: 75px;
margin-left: auto;
margin-right: auto;
clear: both;
position: fixed;
bottom: 0
}