вот код, Ксттаи футер почему-то присутствует, а все остальные картинки Атцутцтвуют *{ margin:0; padding:0; } html,body { width:100%; height:100%; background:#b7b7b7; } #fix { width:1500px; margin:0 auto; min-height:100%; background:#fff; position:relative; } /* Header */ #header{ width:100%; height:429px; background-image:url(images/bg_header.jpg); } #logo { width:166px; height:34px; background:url(images/logo_here.jpg); position:relative; left:300px; top:20px; border:none; padding:0; } #menu{ width:600px; height:35px; position:absolute; left:675px; top:20px; } #menu ul { list-style-image:url(images/poloska.png); list-style-position:inside; } #menu li { float:left; background:url(images/bg-menu.jpg) repeat-x; padding-top:5px; padding-right:15px; padding-left:15px; padding-bottom:5px; } #nav1{ border-radius:5px 0 0 5px; } #nav6{ border-radius:0 5px 5px 0; } #menu a{ text-decoration:none; color:#fff; padding-left:5px; } #menu a:hover{ color:#f0922e; } #bigpic { width:938px; height:303px; background:url(images/bigpic.jpg); margin:30px auto; } #blackbg{ width:920px; height:59px; background:url(images/blackbg.jpg); opacity:0.9; position:relative; top:234px; left:10px; } #dot{ width:150px; height:20px; padding-top:20px; padding-left:20px; } #dot ul{ list-style-image:url(images/dot2.jpg); list-style-position:inside; } #dot li{ float:left; padding-left:6px; cursor:pointer; } #sc2 { width:290px; height:30px; position:absolute; left:600px; top:10px; } #trailer { width:190px; height:28px; color:#fff; background:url(images/bg_sc2.jpg); border-radius:7px; float:left; padding-top:5px; } #trailer a{ text-decoration:none; color:#fff; } #blue{ width:93px; height:28px; background:#359dd4; float:right; border-radius:5px; font-weight:bold; font-family:arial,sans-serif; text-align:center; } #blue a{ text-decoration:none; color:#fff; } #blue p{ padding-top:5px; } /* Content */ #content { padding:20px 20px 400px; overflow:hidden; height:auto; } #content_inside { width:938px; margin:0 auto; background:#fff; } /* #mainbar{ overflow:hidden; } */ /* LEFTBAR */ #leftbar{ width:611px; height:100%; padding:10px; float:left; font-weight:normal; } h3 { margin-bottom:10px; } #leftupbar{ width:610px; height:295px; } #left_up_content{ width:582px; height:160px; } #div_for_img{ background:url(images/marader.png) no-repeat; width:240px; height:127px; float:left; } #div_for_text{ width:315px; height:127px; float:right; font-size:12px; font-family:arial,sans-serif; line-height:1.3; padding-top:5px; } #button { width:94px; height:28px; background:url(images/bluebgcontent.jpg) no-repeat; font-size:12px; font-family:arial,sans-serif; font-weight:bold; color:#fff; border-radius:5px; margin-top:10px; cursor:pointer; } #button p { padding-top:6px; padding-left:12px; } #left__up_down_content{ width:556px; height:75px; } #left_ul { width:228px; height:73px; float:left; line-height:3; margin-left:36px; } #left_ul ul{ list-style-image:url(images/galka.jpg); } #right_ul { width:228px; height:73px; float:right; line-height:3; } #right_ul ul{ list-style-image:url(images/galka.jpg); } #leftdownbar{ padding-top:30px; width:616px; margin-top:20px; font-family:Georgia,sans-serif; font-size:14px; } #lorem1{ width:295px; float:left; font-family:arial,sans-serif; } #lorem1 h3{ margin-bottom:20px; } #lorem2{ width:295px; float:right; font-family:arial,sans-serif; } #lorem2 h3{ margin-bottom:20px; } #button2{ width:94px; height:28px; background:url(images/bluebgcontent.jpg) no-repeat; font-size:12px; font-family:arial,sans-serif; font-weight:bold; color:#fff; border-radius:5px; margin-left:200px; cursor:pointer; } #button2 p { padding-top:6px; padding-left:12px; } #button3{ width:94px; height:28px; background:url(images/bluebgcontent.jpg) no-repeat; font-size:12px; font-family:arial,sans-serif; font-weight:bold; color:#fff; border-radius:5px; margin-left:200px; cursor:pointer; } #button3 p { padding-top:6px; padding-left:12px; } /* RIGHTBAR */ #rightbar{ width:282px; padding:10px; float:right; overflow:hidden; } #rightbar h5{ font-weight:normal; margin-bottom:24px; } #subtitle{ width:268px; height:248px; background:url(images/bgsubtitle.jpg) no-repeat; } #line_1{ width:240px; height:44px; } #pc{ width:33px; height:31px; background:url(images/pc.jpg); float:left; margin-left:25px; margin-top:14px; } #pelen{ width:150px; height:31px; float:right; margin-right:10px; margin-top:20px; font-weight:bold; color:#707070; } #line_2{ width:250px; height:45px; margin-top:15px; } #krestik{ width:33px; height:32px; background:url(images/krestik.jpg); float:left; margin-left:25px; margin-top:14px; } #nulla{ width:170px; height:31px; float:right; margin-right:-2px; margin-top:20px; font-weight:bold; color:#707070; } #line_3{ width:250px; height:45px; margin-top:15px; } #music{ width:32px; height:32px; background:url(images/music.jpg); float:left; margin-left:25px; margin-top:14px; } #vene{ width:170px; height:31px; float:right; margin-right:-2px; margin-top:20px; font-weight:bold; color:#707070; } #line_4{ width:250px; height:45px; margin-top:15px; } #block{ width:32px; height:32px; background:url(images/block.jpg); float:left; margin-left:25px; margin-top:14px; } #tin{ width:170px; height:31px; float:right; margin-right:-2px; margin-top:20px; font-weight:bold; color:#707070; } #lastnews { width:270px; height:218px; background:url(images/lastbg.jpg); } #text11 { line-height:1.6; padding-left:10px; padding-top:8px; } #text22{ line-height:1.6; padding-left:10px; padding-top:8px; } /* Footer */ #footer { background:url(images/bg_footer.jpg); width:100%; height:388px; position:absolute; bottom:0; } HTML !doctype html> <html> <head> <title>Fixed</title> <meta charset="utf-8"> <link href="fixed.css" rel="stylesheet" type="text/css"> </head> <body> <div id="fix"> <!-- HEADER --> <div id="header"> <div id="logo"> </div> <div id="menu"> <ul> <li id="nav1"><a href="#">Home</a></li> <li><a href="#">About</a></li> <li><a href="#">Portfolio</a></li> <li><a href="#">Blog</a></li> <li><a href="#">Features</a></li> <li id="nav6"><a href="#">Contact</a></li> </ul> </div> <div id="bigpic"> <div id="blackbg"> <div id="dot"> <ul> <li><a href="#"></a></li> <li><a href="#"></a></li> <li><a href="#"></a></li> <li><a href="#"></a></li> <li><a href="#"></a></li> <li><a href="#"></a></li> </ul> </div> <div id="sc2"> <div id="trailer"> <a href="#">See Starcraft 2 trailers now!</a> </div> <div id="blue"> <p><a href="#">Learn more</a></p> </div> </div> </div> </div> </div> <!-- CONTENT --> <div id="content"> <div id="content_inside"> <div id="leftbar"> <!-- LEFTBAR --> <div id="leftupbar"> <h3>Features Product</h3> <div id="left_up_content"> <div id="div_for_img"> </div> <div id="div_for_text"> <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit lobortis nisl ut aliquip ex </p> <div id="button"> <p>Learn more</p> </div> </div> </div> <div id="left__up_down_content"> <div id="left_ul"> <ul> <li>Lorem ipsum dolor sit amet</li> <li>Lorem ipsum dolor sit amet</li> </ul> </div> <div id="right_ul"> <ul> <li>Lorem ipsum dolor sit amet</li> <li>Lorem ipsum dolor sit amet</li> </ul> </div> </div> </div> <div id="leftdownbar"> <div id="lorem1"> <h3>Lorem Ipsum Dolor Sit</h3> <div> <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis te feugifacilisi. Duis autem dolor </p> <div id="button2"> <p>Learn more</p> </div> </div> </div> <div id="lorem2"> <h3>Lorem Ipsum Dolor Sit</h3> <div> <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diem nonummy nibh euismod tincidunt ut lacreet dolore magna aliguam erat volutpat. Ut wisis enim ad minim veniam, quis nostrud exerci tution ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis te feugifacilisi. Duis autem dolor </p> <div id="button3"> <p>Learn more</p> </div> </div> </div> </div> </div> <!-- RIGHTBAR --> <div id="rightbar"> <h3>Lorem ipsum dolor sit amet</h3> <h5>Subtitle goes here<h5> <div id="subtitle"> <div id="line_1"> <div id="pc"> </div> <div id="pelen"> <p>Pellentesque nec augue</p> </div> </div> <div id="line_2"> <div id="krestik"> </div> <div id="nulla"> <p>Nulla eleifend quam ipsum</p> </div> </div> <div id="line_3"> <div id="music"> </div> <div id="vene"> <p>Venenatis lobortis libero</p> </div> </div> <div id="line_4"> <div id="block"> </div> <div id="tin"> <p>Tincidunt et ullamcorper</p> </div> </div> </div> <h3>Last News</h3> <div id="lastnews"> <div id="text11"> <p><b>Lorem ipsum dolor sit amet</b><br> <i>July 20th, 2010 | <a href="#">10 Comments</a></i><br> lorem ipsum dolor sit amet </p> </div> <div id="text22"> <p><b>Lorem ipsum dolor sit amet</b><br> <i>July 14th, 2010 |<a href="#"> 08 Comments</a></i><br> lorem ipsum dolor sit amet </p> </div> </div> </div> </div> </div> <!-- FOOTER --> <div id="footer"> asdfdfsdf </div> </div> </body> </html>
