Здравствуйте! Очень нужна помощь, так как я сама никак не найду ошибку! http://www.bredova.ru/temp/cosmos/index-2-col.html в IE 6-7 вторая колонка расползается на всю страницу Код страницы <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title></title> <meta name="title" content="" /> <meta name="keywords" content="" /> <meta name="description" content="" /> <link rel="stylesheet" href="style.css" type="text/css" media="screen, projection" /> <link rel="stylesheet" href="style-2-col.css" type="text/css" media="screen, projection" /> <!--[if lte IE 6]><link rel="stylesheet" href="style_ie.css" type="text/css" media="screen, projection" /><![endif]--> <script type="text/javascript" src="js/jquery.min.js"></script> <script type="text/javascript" src="js/jquery.corner.js"></script> <script type="text/javascript"> $('#round').corner(); </script> </head> <body> <div id="wrapper"> <div id="header"> <h1>Название сайта</h1> </div><!-- #header--> <div id="middle"> <div id="container"> <div id="content"> <div id="round"> <h1>Lorem ipsum dolor</h1> <p> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque pede felis, consequat sit amet, congue in, ultrices id, orci. Phasellus quam lacus, mollis nec, interdum et, malesuada nec, mauris. Nulla facilisi. Ut pharetra dignissim risus. Etiam at sapien et leo porta accumsan. Praesent lacus lectus, elementum quis, lobortis vitae, egestas non, dui. Pellentesque id mi sed felis sollicitudin imperdiet. Vestibulum posuere elit non augue. Nullam pretium. Nam fermentum. Aliquam hendrerit lectus eu eros. Sed viverra cursus enim. </p> <p>Etiam sem. Nullam eget metus non mi accumsan luctus. Nulla tellus lorem, fermentum non, elementum sed, ultrices at, risus. Curabitur nec arcu. Fusce convallis elit quis lorem. Praesent scelerisque. Nunc ultricies tortor non nulla ultrices vestibulum. Nullam rhoncus cursus enim. Morbi molestie feugiat est. Fusce erat ligula, sodales nec, mattis id, scelerisque et, tortor. Aliquam erat volutpat. Vestibulum pharetra lacinia purus. Nunc quam dui, pharetra ac, porta ut, hendrerit et, augue. Fusce purus turpis, pretium at, rhoncus eget, gravida non, purus. Quisque mi purus, mattis sit amet, adipiscing et, suscipit vitae, velit. </p> <p>Nulla sollicitudin libero a odio. Nulla facilisi. Nunc vel arcu. In vestibulum faucibus enim. Nulla commodo, dolor et porta placerat, lectus ante pulvinar ligula, quis dignissim sem nisl sed elit. Nam id pede vel ipsum pulvinar pretium. Mauris id nunc. Vivamus lorem. Proin auctor rutrum ligula. Sed suscipit justo et nunc. Praesent ut leo quis neque luctus eleifend. Vestibulum nec nisl. Proin tincidunt. Sed enim. Curabitur posuere purus a quam. Aenean odio wisi, vestibulum sed, accumsan vitae, rhoncus suscipit, lectus. Sed a lacus. </p> <p>Aenean erat odio, molestie a, lobortis ut, blandit eu, arcu. Donec mauris. Sed sed libero ac sem venenatis sollicitudin. Donec arcu est, volutpat id, dictum a, molestie eu, justo. Nam aliquet faucibus quam. Pellentesque cursus, neque eu placerat facilisis, metus ante fringilla mi, vitae vestibulum nulla turpis quis orci. Quisque nec turpis vel justo volutpat venenatis. Mauris fermentum. Nulla blandit, augue a laoreet gravida, velit lectus molestie wisi, eget volutpat velit eros sit amet tortor. Suspendisse sollicitudin lectus. Nunc velit mauris, ultrices vel, vestibulum et, rhoncus sed, massa. Curabitur luctus erat ac dolor. In pulvinar posuere sapien. Suspendisse dapibus elementum quam. Ut nec diam. Nulla pulvinar. </p> <p> Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque pede felis, consequat sit amet, congue in, ultrices id, orci. Phasellus quam lacus, mollis nec, interdum et, malesuada nec, mauris. Nulla facilisi. Ut pharetra dignissim risus. Etiam at sapien et leo porta accumsan. Praesent lacus lectus, elementum quis, lobortis vitae, egestas non, dui. Pellentesque id mi sed felis sollicitudin imperdiet. Vestibulum posuere elit non augue. Nullam pretium. Nam fermentum. Aliquam hendrerit lectus eu eros. Sed viverra cursus enim. </p> <p>Etiam sem. Nullam eget metus non mi accumsan luctus. Nulla tellus lorem, fermentum non, elementum sed, ultrices at, risus. Curabitur nec arcu. Fusce convallis elit quis lorem. Praesent scelerisque. Nunc ultricies tortor non nulla ultrices vestibulum. Nullam rhoncus cursus enim. Morbi molestie feugiat est. Fusce erat ligula, sodales nec, mattis id, scelerisque et, tortor. Aliquam erat volutpat. Vestibulum pharetra lacinia purus. Nunc quam dui, pharetra ac, porta ut, hendrerit et, augue. Fusce purus turpis, pretium at, rhoncus eget, gravida non, purus. Quisque mi purus, mattis sit amet, adipiscing et, suscipit vitae, velit. </p> <p>Nulla sollicitudin libero a odio. Nulla facilisi. Nunc vel arcu. In vestibulum faucibus enim. Nulla commodo, dolor et porta placerat, lectus ante pulvinar ligula, quis dignissim sem nisl sed elit. Nam id pede vel ipsum pulvinar pretium. Mauris id nunc. Vivamus lorem. Proin auctor rutrum ligula. Sed suscipit justo et nunc. Praesent ut leo quis neque luctus eleifend. Vestibulum nec nisl. Proin tincidunt. Sed enim. Curabitur posuere purus a quam. Aenean odio wisi, vestibulum sed, accumsan vitae, rhoncus suscipit, lectus. Sed a lacus. </p> <p>Aenean erat odio, molestie a, lobortis ut, blandit eu, arcu. Donec mauris. Sed sed libero ac sem venenatis sollicitudin. Donec arcu est, volutpat id, dictum a, molestie eu, justo. Nam aliquet faucibus quam. Pellentesque cursus, neque eu placerat facilisis, metus ante fringilla mi, vitae vestibulum nulla turpis quis orci. Quisque nec turpis vel justo volutpat venenatis. Mauris fermentum. Nulla blandit, augue a laoreet gravida, velit lectus molestie wisi, eget volutpat velit eros sit amet tortor. Suspendisse sollicitudin lectus. Nunc velit mauris, ultrices vel, vestibulum et, rhoncus sed, massa. Curabitur luctus erat ac dolor. In pulvinar posuere sapien. Suspendisse dapibus elementum quam. Ut nec diam. Nulla pulvinar. </p> </div> </div><!-- #content--> </div><!-- #container--> <div class="sidebar" id="sideLeft"> <!-- main menu --> <div class="main-menu"> <h1>SCIENCE</h1> <ul> <li><a href="#">News</a></li> <li><a href="#">Scientific Dates & Deadlines</a></li> <li><a href="#">Scientific Bodies</a></li> <li><a href="#">Scientific Meetings</a></li> <li><a href="#">Special Sessions (GA)</a></li> <li><a href="#">Publications</a></li> </ul> <h1>EDUCATION AND CAPACITY BUILDING</h1> <ul> <li><a href="#">Commission 46</a></li> <li><a href="#">Scientific Dates & Deadlines</a></li> <li><a href="#">Scientific Bodies</a></li> <li><a href="#">Scientific Meetings</a></li> <li><a href="#">Special Sessions (GA)</a></li> <li><a href="#">Publications</a></li> </ul> </div> <!-- /main menu --> </div><!-- .sidebar#sideLeft --> </div><!-- #middle--> </div><!-- #wrapper --> <div id="footer"> <div class="foot-right"> <a href="http://validator.w3.org/check?uri=referer" target="_blank"><img src="http://www.w3.org/Icons/valid-xhtml10-blue" width="88" height="31" alt="Valid XHTML 1.0 Transitional" /></a> <a href="http://jigsaw.w3.org/css-validator/" target="_blank"><img src="http://jigsaw.w3.org/css-validator/images/vcss-blue" width="88" height="31" alt="Valid CSS!" /></a> </div> <div class="copyrights"> © Ваш сайт, 2010 </div> </div><!-- #footer --> </body> </html> Основные стили html, body, img, form {margin: 0px; padding: 0px; border: none;} html, body {height:100%;} body {background: #000 url(img/bg.jpg) no-repeat left top;} body, td {font: 13px Arial, sans-serif; color: #000;} a {color: #000; text-decoration: underline;} a:hover {text-decoration: none;} table {border: 0px; border-collapse: collapse;} td {vertical-align: top;} p {padding: 0px; margin: 0px 0px 12px 0px; line-height:18px;} object {outline:none;} h1 {font-size:22px; padding: 0px; margin: 0px 0px 10px 0px; text-transform:uppercase;} h2 {font-size:19px; padding: 0px; margin: 0px 0px 10px 0px; text-transform:uppercase;} h3 {font-size:17px; padding: 0px; margin: 0px 0px 10px 0px; text-transform:uppercase;} #wrapper { width: 100%; min-width: 1000px; min-height: 100%; height: auto !important; height: 100%; } /* Header —————————————————————————--*/ #header { height: 120px; background: none; } #header h1 { color:#FFF; padding:35px 0 0 20px; font-size:30px; text-transform:none; color:#F90; } /* main-menu */ .main-menu h1 { color:#F90; font-size:14px; padding: 0px; margin: 0px 0px 10px 0px; } .main-menu ul{ margin:0; padding: 0 0 20px 20px; color:#FFF; line-height:20px; } .main-menu ul li a{ color:#FFF; } div#round { background-color: #fff; float: right; padding: 20px; } /* Sidebar Left —————————————————————————--*/ #sideLeft { float: left; width: 250px; margin-left: -100%; position: relative; background: none; padding-left:20px; padding-top:20px; } /* Sidebar Right —————————————————————————--*/ #sideRight { float: left; margin-right: -3px; width: 250px; margin-left: -250px; position: relative; background: none; color:#FFF; } /* Footer —————————————————————————--*/ #footer { margin: -100px auto 0; min-width: 1000px; height: 100px; background: none; } .copyrights {padding:35px 0 0 20px; color:#fff;} .foot-right {width:50%; float:right; padding:35px 20px 0 0; text-align: right;} Середина страницы /* Middle —————————————————————————--*/ #middle { width: 100%; padding: 0 0 100px; height: 1%; } #middle:after { content: '.'; display: block; clear: both; visibility: hidden; height: 0; } #container { width: 100%; float: left; overflow: hidden; } #content { padding: 0 20px 0 270px; }
