здравствуйте, помогите разобраться с версткой.
подвал сайта нужно прикрепить к самому низу экрана, а он у меня плавает в центре. Что я сделала не правильно?
см здесь код html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Документ без названия</title>
<link href="css/style.css" type="text/css" rel="stylesheet">
<script type="text/javascript" src="js/jquery-1.7.1.js"></script>
<!--<script type="text/javascript" src="js/container.js"></script>-->
</head>
<body>
<div class="wrapper">
<div id="left">
<div id="logo"></div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut auctor molestie aliquam. Fusce sed magna orci. Proin neque dui, egestas dapibus feugiat non, condimentum eget arcu. Aenean risus urna, congue in fermentum et, rhoncus sed tortor. Nunc leo turpis, congue non porttitor ac, tempor dictum felis. Nunc hendrerit nibh lorem. Suspendisse ac dui sem, in luctus dui. Donec tincidunt, ante in auctor mattis, urna tellus dignissim nibh, id adipiscing sem nibh a neque. Ut vitae dignissim ligula. Nunc risus erat, ultrices gravida malesuada at, gravida id enim. Sed ultrices tempus erat. Sed iaculis convallis ornare.
Donec suscipit purus eu augue pellentesque a fermentum turpis feugiat. Sed velit lacus, tristique quis volutpat sed, blandit sed lorem. Integer nec tortor tellus. Aliquam metus mi, consequat sed imperdiet id, congue a risus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Proin sit amet sem id nibh mattis ultrices. Ut at turpis non eros dictum volutpat quis id urna. Curabitur auctor odio rutrum lectus adipiscing pretium.
Etiam a magna ac felis ultricies consectetur. Ut tempor quam et nibh vulputate posuere mattis justo eleifend. Donec vitae nisi vitae nisl lobortis consectetur. Mauris mattis tellus id quam mollis convallis. Aliquam erat volutpat. Integer eget lacus nec dui tempor malesuada vel sit amet felis. Aenean nec odio vitae tortor vulputate fermentum. Maecenas tortor orci, euismod et laoreet ac, imperdiet a augue. Nulla a sem quis est porta pharetra. Proin vitae dui nisi, accumsan facilisis massa. Vestibulum enim erat, accumsan at blandit eu, mattis non nunc. Proin vitae odio sed metus scelerisque vestibulum in nec tellus. In hac habitasse platea dictumst. Nulla facilisi. Quisque interdum risus ut turpis lacinia eget condimentum purus porta. Donec egestas, ante vel pellentesque iaculis, dui leo ullamcorper massa, at varius ipsum augue quis leo.
Duis eu urna massa. Maecenas elementum odio nisi. Integer posuere elit quam, luctus feugiat tortor. Donec mattis, ante non ornare venenatis, erat turpis pellentesque mi, ut tincidunt sapien augue quis
</div> <!-- #left end -->
<div id="right">
<div id="header">
<div class="contacts">
</div><!-- .contacts end -->
<div id="slider_container">
</div> <!-- #slider_container end -->
</div><!-- #header end -->
<div class="container">
<div class="title">
</div>
<div id="slider">
</div> <!-- #slider end -->
</div> <!-- #container end -->
</div> <!-- #right end -->
<div class="empty"></div>
</div><!-- #wrapper end -->
<div id="footer">
Этот футер должен быть прикреплен к низу экрана !
</div>
</body>
</html>
css:
[CSS]*{
margin:0; padding:0;
}
html, body {margin:0;padding:0;width:100%;height:100%;}
.wrapper{
width:1194px;
margin:0 auto;
padding-top:39px;
min-height: 100%;
position:relative;
}
#left {
width:238px;
float:left;
}
#right{
width:913px;
float:right;
}
#left #logo{
width:145px;
height:122px;
/*background:url(../images/logo.gif)no-repeat;*/
float:left;
display:block;
background-color:#FF00AE;
}
#header{
width:913px;
height:453px;
}
#header .contacts{
width:913px;
height:63px;
text-align:center;
display:block;
position:relative;
color:#868686;
}
#header .contacts .tel{
position:relative;
top:-7px;
}
#header .contacts .skype{
position:relative;
top:-7px;
}
#slider_container{
width:913px;
height:395px;
position:relative;
display:block;
/*background:url(../images/facebook.jpg)no-repeat;*/
background-color:#ffF330;
}
.container{
width:913px;
position:relative;
display:block;
}
#slider{
/*background:url(../images/slider.jpg)no-repeat;*/
width:923px;
height:508px;
background-color:#ss332;
}
.container .title{
margin:68px 0 /*83px*/0 0;
text-align:center;
height:180px;
font:normal 40px Arial;
color:#9b9b9b;
}
.line{
height:2px;
background:url(../images/hr.gif)repeat-x;
position:relative;
top:27px;
z-index:1;
}
.text{
z-index:2;
position:relative;
top:-25px;
}
#footer{
position:absolute;
bottom:0;
width:1194px;
height:100px;
background-color:#cc0000;
margin:-100px auto 0 auto;
color:#ffffff;
font:normal 20px Arial;
text-align:center;
line-height:99px;
}
.empty {height:100px; }[/CSS]
искала в поисковиках решение, делала разными способами по инструкции, но не получается никак :rolleyes:
Сообщение сайта
Прикрепить футер к низу экрана...
alexa89
0 
16.3.2012, 15:11;
Ответить: Bugnet
