Возникла такая проблема: пытаюсь прижать футер к нижней части экрана, с помощью таких свойств:
html, body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
#wrapper {
min-width: 480px;
max-width: 1050px;
margin: 0 auto;
min-height: 100%;
height: auto !important;
height: 100%;
position: relative;
}
* html #wrapper {
height: 100%;
}
/* Middle
-----------------------------------------------------------------------------*/
#middle {
width: 100%;
padding: 0 0 100px;
height: 1%;
position: relative;
}
#middle:after {
content: '.';
display: block;
clear: both;
visibility: hidden;
height: 0;
}
#container {
width: 100%;
float: left;
overflow: hidden;
}
#content {
padding: 0 270px 0 0;
}
/* Sidebar Right
-----------------------------------------------------------------------------*/
#sideRight {
float: left;
margin-right: -3px;
width: 250px;
margin-left: -250px;
position: relative;
}
/* Footer
-----------------------------------------------------------------------------*/
#footer{
width: 100%;
background-color: #010101;
height: 150px;
overflow: hidden;
position: absolute;
bottom: -120px;
left: 0;
}
<div id="wrapper">
<header id="header">
Тут вложено куча дивов
</header>
</div><!--#WRAPPER-->
<section id="middle">
<div id="container">
<div id="content">
Тут вложено куча дивов
</div><!-- #content-->
</div><!-- #container-->
<aside id="sideRight">
</aside><!-- #sideRight -->
</section><!-- #middle-->
<footer id="footer">
</footer>
Есть страницы где все ок, но а есть где футер наезжает на контент, в IE вообще беда(( Помогите, пожалуйста, сделать верстку кросс-браузерной. Буду очень благодарен любой помощи, так как нет профессиональных навыков верстки...