RobotWerder

элементам навигации и меню не хватает hover эффектов

есть гориз меню на joomla сверстанное с косяками beta.openvpn.ru . проблема в том что пункты падают на следующую строчку при уменьшении окна браузера. возможно ли сделать так чтобы меню автоматически сжималось при сужении окна браузера, либо варант 2 возможно ли хотя бы зафиксировать его по ширине, но чтобы пункты меню списка были в одной строке и не падали вниз.. если возможно то как?.. замучался гуглить и править код.. подскажите пжлста гуру. вот обрывки хтмль и css <table class="menubg" width="100%" height="33px" align="center" border="0" cellpadding="0" cellspacing="0" background"menu_bg_.jpg"> <td> <div id="top"> <table cellpadding="0" cellspacing="0" class="moduletable"> <tr> <td> <ul class="menu-nav" id="top"> <li id="current" class="active item1"> <a href="http://localhost/"> <span>Главная</span> </a> </li> <li class="item18"> <a href="/index.php?option=com_content&view=category&id=39&Itemid=18&lang=ru"> <span>Настройка и помощь</span> </a> </li> <li class="item29"> <a href="/index.php?option=com_content&view=article&id=22&Itemid=29&lang=ru"> <span>Особенности</span> </a> </li> ul.menu-nav2 { list-style-type: none; width: 100%; } ul.menu-nav2 li { display: inline; padding-left: 12px; margin: 0px; } ul.menu-nav li a { color: #FFFFFF; font-size: 14px; text-decoration: none; } ul.menu-nav li a:hover { color: #FFFFFF; font-size: 14px; text-decoration: underline; } ul.menu-nav2 li.item28 { background-image: url(../images/in.jpg); background-repeat: no-repeat; color:#FFFFFF; background-position: 2px center; display: inline; } ul.menu-nav2 li.item29 { background-image: url(../images/in.jpg); background-repeat: no-repeat; color:#FFFFFF; background-position: 2px center; display: inline; }

спасибо большое... со span-ами и тэгами p разобрался .. пользуясь случаем спрошу, а что вы например скажете на это : character "<" is the first character of a delimiter but occurred as data …sConfig_live_site;?>/templates/ssmp/<?php echo _DIRECTION;?>/images/bac_logo. и на часто встречающееся мне end tag for "head" which is not finished </head> , хотя тэг хэд закрыт

document type does not allow element "p" here; missing one of "button", "map", "object", "ins", "del", "noscript" start-tag документ не валиден .. что за ошибка..?.. многое что устранил, но к сожалению застрял на этом нюансе ..

да да ... было бы ооочень здорево

Дня три четыре назад отправил форму авторизации .. Vlad .. отзовись плиз!! .. (лучше на почту)

Никто никому ничего не должен.. я ничего не требовал и очень ценю вашу помощь Дмитрий и Влад !!! искреннее Спасибо!!!

хм.. господа-товарищи .Vlad!!. мне опыт нужен а не прохождение квестов. ведь это же не сложно написать адрес электронной почты. Я конечно понимаю, что вас забавляют подобные мммм... задачки, но всё же ..!!! казалось бы мелочь, форма авторизации, но для меня это важно, поверьте! это опыт. Может пойдете навстречу в обход квестам?!

Влад !!! твоё мыло скрыто в профайле.. или я чо та недогоняю в настройках форума?! Будь добр отпиши в личку.

хм... форму доверстал, есть моменты которые надо прояснить, автор откликнитесь !!? странно, с сегодняшнего дня аваст при загрузке сайта обнаруживает червячка HTML:Iframe-inf и на стойчив в желании прервать соединение .. хм ... хм... форму доверстал, есть моменты которые надо прояснить, автор откликнитесь !!? странно, с сегодняшнего дня аваст при загрузке сайта обнаруживает червячка HTML:Iframe-inf и на стойчив в желании прервать соединение .. хм ... хм... форму доверстал, есть моменты которые надо прояснить, автор откликнитесь !!? странно, с сегодняшнего дня аваст при загрузке сайта обнаруживает червячка HTML:Iframe-inf и на стойчив в желании прервать соединение .. хм ...

Странно слышать это от автора, но тем не менее конечно же возьмусь

Спасибо ..буду верстать.. понял что верстка будет резиновая ... ток как быть с колонками.. четкого задания нет !?.. а вообще если кому то чот та надо сверстать нахаляву..пишите..предложение действительно!!

У меня ещё мало опыта . Хочу поднабраться его, особенно в верстке.. могу сделать несложный сайт, нарисовать флеш, но поверстать хочется, т к это моё слабое место. обращайтесь .. чем интереснее тема тем лучше.. Да ..всё безДвозДмезДно

У меня ещё мало опыта . Хочу поднабраться его, особенно в верстке.. могу сделать несложный сайт, нарисовать флеш, но поверстать хочется, т к это моё слабое место. обращайтесь .. чем интереснее тема тем лучше.. Да ..всё безДвозДмезДно

левый и правый блоки в опере 9.27 сильно смещены относительно нужного положения вправо а центральное выпадающее меню в FF уехало вообще непонятно куда (где то сбоку и справа).. относительно оперы ситуация непонятная. На локали у меня все выглядит нормально, а как только программер сливает их на сервер всё выглядит ужасно В общем косяков там хватает, но устранить хотелось бы для начала самые ужасные http://plus-strahovanie.ru/ не знаю нужен ли весь код но выложу все таки целиком, заранее спасибо /* CSS Document */ html { height: 100%; } body { height: 100%; margin: 0px 0px 0px 0px; background-color:#FFFFFF; color: #000000; } .clr { clear: both; } #logo { background-image: url(images/2.jpg); background-repeat: no-repeat; height: 81px; width: 925px; margin-left: 10px; } #main { width:925px; } #main_body { float: left; width:450px; text-align:left; background-color: #F9F7F7; } #center { float: left; width:443px; height:100%; margin-left: 27px; } * html #center { margin-left:13.5px; } #center2 { float: left; width:670px; height:100%; margin-left: 15px; } * html #center2 { margin-left:7.5px; } #left { float: left; width:173px; height:100%; background-color: #F9F7F7; margin-top: 10px; padding-right: 0px; padding-left: 0px; text-align: center; } #right { float: right; width:202px; height:100%; text-align:left; color:#FFFFFF; margin-right: 15px; } * html #right { margin-right:7.5px; } #rightinner { margin-right: 0px; margin-left: 0px; padding-top: 80px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; height: 100%; background-image: none; color: #000000; } .leftinner{ padding-bottom: 0px; height: 100%; background-image: none; color: #000000; } #container { width:925px; height: 100%; padding: 0px; margin-top: 0px; margin-right: 10px; margin-bottom: 0px; margin-left: 10px; } #contmenu { float: left; width:925px; color:#000000; height: 58px; } #contmenuleft { float: left; height: 58px; background-image: url(images/1_08.jpg); background-repeat: no-repeat; width: 300px; margin-left: 15%; padding:0; } * html #contmenuleft{ margin-left: 10%; } #contmenuright { float: right; height: 58px; background-image: url(images/1_06.jpg); background-repeat: no-repeat; width: 216px; margin-right: 20%; padding:0; } * html #contmenuright{ margin-right:10%; } #conttop { width:905px; background-image: url(images/1k_03.jpg); background-repeat: no-repeat; background-position: center top; height: 48px; float: left; margin-right: 10px; margin-left: 10px; } #contcenter { width:905px; background-image: url(images/1_05.jpg); background-repeat: repeat-y; height:100%; background-position: center top; z-index: -2; float: left; padding: 0px; margin-top: 0px; margin-right: 10px; margin-bottom: 0px; margin-left: 10px; } #contbottom { width:905px; background-image: url(images/1k_26.jpg); background-repeat: no-repeat; background-position: center bottom; height: 49px; float: left; margin-right: 10px; margin-left: 10px; } #contleft { width:905px; height:100%; } #footer { float: left; width:925px; color:#000000; text-align:center; background-image: url(images/2_08.jpg); background-repeat: no-repeat; height: 125px; margin-left: 10px; } #footer1{ float: left; width:925px; background-color:#FFFFFF; color:#000000; text-align:center; background-image: url(images/12_27.jpg); background-repeat: no-repeat; height: 99px; } #footer a { color:#0000FF; font-weight:bold; } #top { float: left; width:925px; background-image:url(images/1.jpg); text-align:left; height:211px; background-repeat: no-repeat; margin-left: 10px; } #top1 { float: left; width:925px; text-align:left; height:121px; background-repeat: no-repeat; margin-left: 10px; } #menu1 { float: left; width:925px; text-align:left; height:121px; background-repeat: no-repeat; } .modulecont { padding: 0; margin: 0 0 0 0; width: 925px; z-index: -1; } .modulecont div { padding: 0; margin: 0; background-image: url(images/1_05.jpg); background-repeat: repeat-y; background-position: center top; z-index: -1; } .modulecont div div { padding:0; background-image: url(images/1_032.jpg); background-repeat: no-repeat; background-position: center top; z-index: -1; } .modulecont div div div { text-align: center; padding: 0px 0 0px; background-color: transparent; background-image: url(images/1korp_27.jpg); background-repeat: no-repeat; background-position: center bottom; z-index: -1; } .module { margin: 0; width: 173px; z-index: 1; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } .module div { padding: 0; margin: 0; /*bottom 14px*/ background-image: url(images/1korp_07.jpg); background-repeat: repeat-y; background-position: center top; z-index: 1; width: 173px; } .module div div { padding:0; background-image: url(images/1korp_03.jpg); background-repeat: no-repeat; background-position: center top; z-index: 1; width: 173px; } .module div div div { text-align: center; background-image: url(images/1korp_17.jpg); background-repeat: no-repeat; background-position: center bottom; z-index: 1; width: 173px; padding-top: 0px; padding-bottom: 20px; padding-right: 0px; padding-left: 0px; } .module1 { padding: 0; margin-top: 10px; width: 443px; margin-bottom: 10px; z-index:2; } * html .module1{ margin-left: 5px; margin-right: 5px; } .module1 div { background-image: url(images/1korp_08.jpg); background-repeat: repeat-y; width: 443px; padding-top: 0; padding-right: 0px; padding-bottom: 0; padding-left: 0px; margin-top: 0; margin-right: 0px; margin-bottom: 0; margin-left: 0px; z-index:2; } .module1 div div { padding:0; background-image: url(images/1korp_05.jpg); background-repeat: no-repeat; background-position: center top; width: 443px; z-index:2; } .module1 div div div { text-align: justify; background-image: url(images/1korp_21.jpg); background-repeat: no-repeat; background-position: center bottom; width: 443px; z-index:2; padding-top: 0px; padding-bottom: 20px; padding-right: 0px; padding-left: 0px; } .module2 { padding: 0; width: 202px; margin-top: 10px; margin-bottom: 0px; margin-left: 0px; z-index:3; } .module2 div { padding: 0; margin: 0; /*bottom 14px*/ background-image: url(images/1korp_15.jpg); background-repeat: repeat-y; background-position: center top; width: 202px; z-index:3; } .module2 div div { padding:0; background-image: url(images/1_11.jpg); background-repeat: no-repeat; background-position: center top; width: 202px; z-index:3; } .module2 div div div { text-align: center; padding: 0px 0 20px; background-image: url(images/1korp_19.jpg); background-repeat: no-repeat; background-position: center bottom; width: 202px; z-index:3; } /** old stuff **/ body { padding: 0px; font-family: "Century Gothic"; line-height: 16px; font-size: 11px; color:#666666; text-align: justify; } /* basic links on the site */ a:link { color: #666666; text-decoration: none; font-weight: bold; line-height: 14px; font-size: 12px; } a:hover { color: #FF6600; text-decoration: underline; font-weight: bold; line-height: 14px; font-size: 12px; } a:visited { color: #333333; text-decoration: none; font-weight: bold; line-height: 14px; font-size: 12px; } #rightinner a { color: #666666; text-decoration: none; font-weight: bold; line-height: 35px; font-size: 12px; } #rightinner a:hover { color: #FF6600; text-decoration: underline; font-weight: bold; line-height: 35px; font-size: 12px; } #rightinner a:visited { color: #333333; text-decoration: none; font-weight: bold; line-height: 35px; font-size: 12px; } a.footer:link { color: #626262; text-decoration: none; font-weight: normal; } a.footer:visited { color: #333333; text-decoration: none; font-weight: normal; } a.footer:hover { color: #FF6600; text-decoration: underline; } .inputbox { padding: 2px; border:solid 1px #cccccc; background-color: #ffffff; } p { margin-left: 0px; padding-left: 20px; padding-right: 20px; padding-bottom: 15px; } .content { color: #316012; font-size: 10px; height: 100%; padding-top: 15px; padding-bottom: 15px; padding-left: 15px; padding-right: 15px; border: 0px; } .contentimage { float: left; border: 3px solid #CCCCCC; margin-top: 10px; margin-right: 10px; margin-bottom: 0px; margin-left: 0px; } #text { padding-top: 15px; padding-bottom: 15px; padding-left: 10px; padding-right: 10px; width: 150px; height: 100%; } /* * html p{ padding-left: 15px; } #left p{ margin-bottom: 5px; text-align: justify; margin-right: 0px; margin-left: 0px; padding-right: 0px; padding-left: 0px; } basic links on the site */ * html #left p{ } h1{ font-family: "Century Gothic"; color: #FF9900; text-align: center; font-weight: bold; font-size: 18px; padding-top: 20px; margin: 0px; } h2{ color: #e2292c; font-family: Arial; font-size: 17px; font-weight: normal; } h3{ color: #e2292c; font-family: Arial; font-size: 15px; font-weight: normal; } br{ padding-top: 5px; } .inp { padding: 2px; background-color: #F9F7F8; display: inline; width: 120px; text-align: center; border-top-width: thin; border-right-width: thin; border-bottom-width: thin; border-left-width: thin; } .fInp { padding: 2px; background-color: #F9F7F8; display: inline; width: 120px; text-align: center; border-top-width: thin; border-right-width: thin; border-bottom-width: thin; border-left-width: thin; } .inp2 { padding: 2px; background-color: #F9F9F9; height: 100px; width: 140px; display: inline; } .but { color: #666666; font-family: Arial, Hevlvetica, sans-serif; text-align: center; font-size: 11px; font-weight: bold; width: auto; padding: 0px 5px; line-height: 18px !important; line-height: 16px; height: 26px !important; height: 24px; margin: 1px; } .forma { margin: 0px; padding: 0px; width: 300px; } .on { font-family: "Century Gothic"; font-size: 12px; font-weight: bold; color: #666666; } .image1 { PADDING-RIGHT: 0px; BACKGROUND-POSITION: 0px 2px; DISPLAY: block; PADDING-LEFT: 20px; BACKGROUND-IMAGE: url(images/1korp2_25.jpg); PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; BACKGROUND-REPEAT: no-repeat; } .image2 { PADDING-RIGHT: 0px; BACKGROUND-POSITION: 0px 2px; DISPLAY: block; PADDING-LEFT: 35px; BACKGROUND-IMAGE: url(images/1korp2_28.jpg); PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; BACKGROUND-REPEAT: no-repeat; } .image3 { PADDING-RIGHT: 0px; BACKGROUND-POSITION: 0px 2px; DISPLAY: block; PADDING-LEFT: 20px; BACKGROUND-IMAGE: url(images/1korp2_33.jpg); PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; BACKGROUND-REPEAT: no-repeat; } .image4 { PADDING-RIGHT: 0px; BACKGROUND-POSITION: 0px 2px; DISPLAY: block; PADDING-LEFT: 25px; BACKGROUND-IMAGE: url(images/1korp2_37.jpg); PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px; BACKGROUND-REPEAT: no-repeat; }

можно ещё вопросик.. в левом синем блоке текст выпадает и я никак не мог это вылечить менял маргины и паддинги , но почему то не помогало.. как это исправить ?! Сейчас там всё держится на тэге <p> но это не правильно.. ткест же должен нормально ложиться в контейнер и без этого ..

в верстке я далеко не спец, но очень нужно сделать как надо, проблема по адресу http://plus-strahovanie.ru/index.php?page=reg центральный блок в ие6 проваливается вниз ..Как это исправить незнаю..даже после того как я убираю все стили связанные с формой ситуация не меняется .. подскажите пожалуйста где копать?! вот часть хтмля <form method="post" action="" onsubmit=" if(this.name.value==''){alert('Заполните поле ФИО');this.name.focus();return false;} if(this.login.value==''){alert('Заполните поле Логин');this.login.focus();return false;} if(this.password.value==''){alert('Заполните поле Пароль');this.password.focus();return false;} if(this.password.value!=''){ if(this.password.value!=this.password2.value) {alert('Введены несовпадающие пароли');this.password2.focus();return false;}} if(this.name.value==''){alert('Заполните поле ФИО');this.name.focus();return false;} if(this.phone.value==''){alert('Заполните поле Телефон');this.phone.focus();return false;} "> <input name="regged" type="hidden" value="1" /> <table> <tr valign="top"> <td><p class="fData"><span class='on'>ФИО <strong>*</strong>:</span></p></td> <td><p class="fInp"><input type="text" class="inp" name="name" /></p></td> </tr> <tr valign="top"> <td><p class="fData"><span class='on'>Логин <strong>*</strong>:</span></p></td> <td><p class="fInp"><input type="text" class="inp" name="login" /></p></td> </tr> <tr valign="top"> <td><p class="fData"><span class='on'>Пароль <strong>*</strong>:</span></p></td> <td><p class="fInp"><input type="password" class="inp" name="password" /></p></td> </tr> <tr valign="top"> <td><p class="fData"><span class='on'>Подтверждение пароля <strong>*</strong>:</span></p></td> <td><p class="fInp"><input type="password" class="inp" name="password2" /></p></td> </tr> <tr valign="top"> <td><p class="fData">Телефон <strong>*</strong>:</p></td> <td><p class="fInp"><input name="phone" type="text" class="inp"/></p></td> </tr> <tr valign="top"> <td><p class="fData">E-mail:</p></td> <td><p class="fInp"><input name="email" type="text" class="inp"/></p></td> </tr> <tr valign="top"> <td><p class="fData">Адрес:</p></td> <td><p class="fInp"><input name="address" type="text" class="inp"/></p></td> </tr> <tr valign="top"> <td><p class="fData"><span class='on'>Примечание <strong>*</strong>:</span></p></td> <td><p class="fInp"><textarea name="comment" type="text" class="inp2" /></textarea></p> <input type="submit" class="but" value="Очистить" /><input type="submit" class="but" value="Отправить" /></td> </tr> </table> </form> и часть стиля table.contentpane { width: 300px; padding: 0px; border-collapse: collapse; border-spacing: 0px; margin: 0px; } table.contentpane td { margin: 0px; padding: 0px; } table.contentpane { padding-left: 4px; } .inp { padding: 2px; background-color: #ffffff; display: inline; } .inp2 { padding: 2px; border:solid 1px #cccccc; background-color: #ffffff; height: 100px; width: 150px; display: inline; } .but { color: #c64934; font-family: Arial, Hevlvetica, sans-serif; text-align: center; font-size: 11px; font-weight: bold; border: 3px double #cccccc; width: auto; background: url(../images/button_bg.png) repeat-x; padding: 0px 5px; line-height: 18px !important; line-height: 16px; height: 26px !important; height: 24px; margin: 1px; } .forma { margin: 0px; padding: 0px; width: 300px; }

Вот часть хтмль... проблема в двух словах в том что текст некрасиво вылезает за рамки jpeg и я немогу отступы нормально сделать для текста лежащего внутри блоков текста ... правый блок в ие уходит вниз либо рушится центральный блок в котором лежат эти три.. подхода не найду из за отсутствия опыта, то ли сделать внутри ещё div, хотя padding и изнутри распирает блоки?! То ли ещё каким нить неизвестным мне способом.?! <div id="conttop"> </div> <div id="contcenter"> <div id="left"> <div class="module"> <div> <div> <div> <h1>wertret</h1> dfgdffffffffffffffffffffff dfgdfgdfgdfgdfgdffffffffffffffffffff gdfgfdfgdfgfgdffdgretreyytrytry fffffffffffffffffffffffffffffffffffffffffffffffff rrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrr ttttttttttttttttttttttttfdggggggggg rrrrrrrrrrrrrrrrrrrrrrrrrrrrh hhhhhhhhhhhhhhhhhhhhhhh ttttttttttttttttttttttttt </div> </div> </div> </div></div> <div id="center"><div id="main_body"> <div class="module1"> <div> <div> <div> <h1>dfgdfgfgdfg</h1> dfgdffffffffffffffffffffff dfgdfgdfgdfgdfgdffffffffffffffffffff gdfgfdfgdfgfgdffdgretreyytrytry fffffffffffffffffffffffffffffffffffffffffffffffff rrrr22222222222222222 222222222222222222222 22222222222222222 rr22222222222222222 222222222222222222222 22222222222222222 rr22222222222222222 222222222222222222222 22222222222222222 rr22222222222222222 222222222222222222222 22222222222222222 ttttttttttttttttttttttttt </div> </div> </div> </div> </div></div> <div id="right"> <div class="module2"> <div> <div> <div> <div id="rightinner"> <h1>dfgdfg</h1> dfgdffffffffffffffffffffff <br >dfgdfgdfgdfgdfgdffffffffffffffffffff <br >d333333333333333333333333 <br >d33333333333333333333333333 <br >d33333333333333333333333333 <br >d 3333333333333333333333333333 <br >d 3333333333333333333333333333 <br >d 3333333333333333333333333333 </div> </div> </div> </div> </div></div> </div> и css фрагмент кода .. #left { float: left; width:173px; height:100%; background-color: #F9F7F7; margin-left: 30px; margin-top: 10px; padding-right: 0px; padding-left: 0px; } * html #left{ margin-left:15px; } #right { float: right; width:202px; height:100%; text-align:left; color:#FFFFFF; margin-right: 30px; } подскажите где собака порылась пожалуйста * html #right{ margin-right:15px; } #rightinner { margin-right: 0px; margin-left: 0px; padding-top: 80px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; height: 100%; background-image: none; color: #666666; } .modulecont { padding: 0; margin: 0 0 0 0; width: 925px; z-index: -1; } .modulecont div { padding: 0; margin: 0; background-image: url(images/1_05.jpg); background-repeat: repeat-y; background-position: center top; z-index: -1; } .modulecont div div { padding:0; background-color: transparent; background-image: url(images/1_032.jpg); background-repeat: no-repeat; background-position: center top; z-index: -1; } .modulecont div div div { text-align: center; padding: 0px 0 0px; background-color: transparent; background-image: url(images/1korp_27.jpg); background-repeat: no-repeat; background-position: center bottom; z-index: -1; } .module { margin: 0; width: 173px; z-index: 1; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; } .module div { padding: 0; margin: 0; /*bottom 14px*/ background-image: url(images/1korp_07.jpg); background-repeat: repeat-y; background-position: center top; z-index: 1; width: 173px; } .module div div { padding:0; background-color: transparent; background-image: url(images/1korp_03.jpg); background-repeat: no-repeat; background-position: center top; z-index: 1; width: 173px; } .module div div div { text-align: center; background-color: transparent; background-image: url(images/1korp_17.jpg); background-repeat: no-repeat; background-position: center bottom; z-index: 1; width: 173px; padding-top: 0px; padding-bottom: 20px; } .module1 { padding: 0; margin-top: 10px; width: 443px; margin-right: 0px; margin-bottom: 10px; margin-left: 15px; z-index:2; } * html .module1{ margin-left: 15px;; } .module1 div { background-image: url(images/1korp_08.jpg); background-repeat: repeat-y; width: 443px; padding-top: 0; padding-right: 0px; padding-bottom: 0; padding-left: 0px; margin-top: 0; margin-right: 0px; margin-bottom: 0; margin-left: 0px; z-index:2; } .module1 div div { padding:0; background-color: transparent; background-image: url(images/1korp_05.jpg); background-repeat: no-repeat; background-position: center top; width: 443px; z-index:2; } .module1 div div div { text-align: center; padding: 0px 0 20px; background-color: transparent; background-image: url(images/1korp_21.jpg); background-repeat: no-repeat; background-position: center bottom; width: 443px; z-index:2; }

Дело касается текста .. помещаю его в контейнер и он несколько выезжает за его пределы .. Конечно делаю отступы, ноо.... В общем то изначально левый блок <div id="left"> имеет 173 пикселя в ширину, но отчего то он кажется шире, хотя картинки в нем именно 173 пикселя в ширину. почему так это первый вопрос?! И Естественно исходя из того что "left" шире и отступы для него делаю отдельно, но как ни делаю раскладка рушится потому что правый блок в ие6 постоянно уезжает вниз или некрасиво вылезает бэкграунд картинка большого контейнера.. подскажите Как решить эту проблемку ?! Ссылочки на макет нет так как пока все делаю локально .. В Css не спец. Спасибо за ответики <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=<?php echo _ISO; ?>" /> <link rel="stylesheet" href="css2.css"> </head> <body> <div align="center" id="body"> <div id="main"> <div id="logo"></div> <div id="top">top top top top top top top top top </div> <div id="top1">top top top top top top top top top </div> <div id="container"> <div id="contmenu"> <div id="contmenuleft"></div> <div id="contmenuright"></div> </div> <div id="conttop"> </div> <div id="contcenter"> <div id="left"> <div class="module"> <div> <div> <div> <div id="leftinner"> <h1>dfgdfg</h1> <p>dfgdffffffffffffffffffffff dfgdfgdfgdfgdfgdffffffffffffffffffff gdfgfdfgdfgfgdffdgretreyytrytry fffffffffffffffffffffffffffffffffffffffffffffffff rrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrr ttttttttttttttttttttttttfdggggggggg rrrrrrrrrrrrrrrrrrrrrrrrrrrrh hhhhhhhhhhhhhhhhhhhhhhh ttttttttttttttttttttttttt</div> </div> </div> </div> </div></div> <div id="center"><div id="main_body"> <div class="module1"> <div> <div> <div> <h1>dfgdfgfgdfg</h1> <p>dfgdffffffffffffffffffffff dfgdfgdfgdfgdfgdffffffffffffffffffff gdfgfdfgdfgfgdffdgretreyytrytry fffffffffffffffffffffffffffffffffffffffffffffffff rrrr22222222222222222 <p>222222222222222222222 22222222222222222 rr22222222222222222 <p>222222222222222222222 22222222222222222 <p>rr22222222222222222 222222222222222222222 22222222222222222 rr22222222222222222 222222222222222222222 22222222222222222 ttttttttttttttttttttttttt </div> </div> </div> </div> </div></div> <div id="right"> <div class="module2"> <div> <div> <div> <div id="rightinner"> <h1>dfgdfg</h1> <p>dfgdffffffffffffffffffffff <br >dfgdfgdfgdfgdfgdffffffffffffffffffff <br >d333333333333333333333333 <br >d33333333333333333333333333 <br >d33333333333333333333333333 <br >d 3333333333333333333333333333 <br >d 3333333333333333333333333333 <br >d 3333333333333333333333333333 </div> </div> </div> </div> </div></div> </div> <div id="contbottom"></div> </div> <div id="footer1">footer"footer"footer"footer"footer"footer"footer"footer"footer"footer"footer"footer"</div> <div id="footer">footer"footer"footer"footer"footer"footer"footer"footer"footer"footer"footer"footer"</div> </div> </div> </body> </html> /* CSS Document */ html { height: 100%; } body { height: 100%; margin: 0px 0px 0px 0px; background-color:#FFFFFF; font-family: "Century Gothic"; font-size: 10px; color: #000000; } .clr { clear: both; } #logo { background-image: url(images/2.jpg); background-repeat: no-repeat; height: 81px; width: 925px; } #main { width:925px; } #main_body { float: left; width:450px; text-align:left; background-color: #F9F7F7; } #main_body2 { float: left; width:700px; text-align:left; padding: 8px 8px 8px 8px; } #center { float: left; width:450px; height:100%; } #center2 { float: left; width:700px; height:100%; } #left { float: left; width:173px; height:100%; text-align:left; background-color: #F9F7F7; margin-left: 30px; margin-top: 10px; } * html #left{ margin-left:10px; } #right { float: right; width:202px; height:100%; text-align:left; color:#FFFFFF; margin-right: 30px; } #rightinner { margin-right: 0px; margin-left: 0px; padding-top: 80px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; height: 100%; background-image: none; color: #666666; } #leftinner{ margin-left: 0px; padding-right: 15px; padding-bottom: 0px; padding-left: 5px; height: 100%; background-image: none; color: #666666; width: 130px; } * html #right{ margin-right:15px; } #container { width:905px; height: 100%; } #contmenu { float: left; width:925px; color:#FFFFFF; height: 58px; } #contmenuleft { float: left; height: 58px; background-image: url(images/1_08.jpg); background-repeat: no-repeat; width: 300px; margin-left: 15%; padding:0; } * html #contmenuleft{ margin-left: 10%; } #contmenuright { float: right; height: 58px; background-image: url(images/1_06.jpg); background-repeat: no-repeat; width: 216px; margin-right: 20%; padding:0; } * html #contmenuright{ margin-right:10%; } #conttop { width:905px; background-image: url(images/1k_03.jpg); background-repeat: no-repeat; background-position: center top; height: 48px; float: left; } #contcenter { width:905px; background-image: url(images/1_05.jpg); background-repeat: repeat-y; height:100%; background-position: center top; z-index: -2; float: left; margin: 0px; padding: 0px; } #contbottom { width:905px; background-image: url(images/1k_26.jpg); background-repeat: no-repeat; background-position: center bottom; height: 49px; float: left; } #contleft { width:905px; height:100%; } #footer { float: left; width:925px; color:#FFFFFF; text-align:center; background-image: url(images/2_08.jpg); background-repeat: no-repeat; height: 125px; } #footer1{ float: left; width:925px; background-color:#FFFFFF; color:#FFFFFF; text-align:center; background-image: url(images/12_27.jpg); background-repeat: no-repeat; height: 99px; } #footer a { color:#FFFFFF; font-weight:bold; } #top { float: left; width:925px; background-image:url(images/1.jpg); line-height:36px; text-align:left; height:211px; background-repeat: no-repeat; } #top1 { float: left; width:925px; background-image:url(images/12.jpg); line-height:36px; text-align:left; height:121px; background-repeat: no-repeat; } .modulecont { padding: 0; margin: 0 0 0 0; width: 925px; z-index: -1; } .modulecont div { padding: 0; margin: 0; background-image: url(images/1_05.jpg); background-repeat: repeat-y; background-position: center top; z-index: -1; } .modulecont div div { padding:0; background-color: transparent; background-image: url(images/1_032.jpg); background-repeat: no-repeat; background-position: center top; z-index: -1; } .modulecont div div div { text-align: center; padding: 0px 0 0px; background-color: transparent; background-image: url(images/1korp_27.jpg); background-repeat: no-repeat; background-position: center bottom; z-index: -1; } .module { padding: 0; margin: 0 0 0 0; width: 173px; z-index: 1; } .module div { padding: 0; margin: 0; /*bottom 14px*/ background-image: url(images/1korp_07.jpg); background-repeat: repeat-y; background-position: center top; z-index: 1; width: 173px; } .module div div { padding:0; background-color: transparent; background-image: url(images/1korp_03.jpg); background-repeat: no-repeat; background-position: center top; z-index: 1; width: 173px; } .module div div div { text-align: center; padding: 0px 0 20px; background-color: transparent; background-image: url(images/1korp_17.jpg); background-repeat: no-repeat; background-position: center bottom; z-index: 1; width: 173px; } .module1 { padding: 0; margin-top: 10px; width: 443px; margin-right: 15px; margin-bottom: 10px; margin-left: 15px; z-index:2; } * html .module1{ margin-left: 1px;; } .module1 div { background-image: url(images/1korp_08.jpg); background-repeat: repeat-y; width: 443px; padding-top: 0; padding-right: 0px; padding-bottom: 0; padding-left: 0px; margin-top: 0; margin-right: 0px; margin-bottom: 0; margin-left: 0px; z-index:2; } .module1 div div { padding:0; background-color: transparent; background-image: url(images/1korp_05.jpg); background-repeat: no-repeat; background-position: center top; width: 443px; z-index:2; } .module1 div div div { text-align: center; padding: 0px 0 20px; background-color: transparent; background-image: url(images/1korp_21.jpg); background-repeat: no-repeat; background-position: center bottom; width: 443px; z-index:2; } .module2 { padding: 0; width: 202px; margin-top: 10px; margin-bottom: 0px; margin-left: 0px; z-index:3; } .module2 div { padding: 0; margin: 0; /*bottom 14px*/ background-image: url(images/1korp_15.jpg); background-repeat: repeat-y; background-position: center top; width: 202px; z-index:3; } .module2 div div { padding:0; background-color: transparent; background-image: url(images/1_11.jpg); background-repeat: no-repeat; background-position: center top; width: 202px; z-index:3; } .module2 div div div { text-align: center; padding: 0px 0 20px; background-color: transparent; background-image: url(images/1korp_19.jpg); background-repeat: no-repeat; background-position: center bottom; width: 202px; z-index:3; } /** old stuff **/ body { padding: 0px; font-family: "Century Gothic"; line-height: 120%; font-size: 11px; color:#CCCCCC; } /* basic links on the site */ a:link, a:visited { color: #e2292c; text-decoration: none; font-weight: normal; } a:hover { color: #e2292c; text-decoration: underline; font-weight: normal; } a.footer:link, a.footer:visited { color: #626262; text-decoration: none; font-weight: normal; } a.footer:hover { color: #626262; text-decoration: underline; } .inputbox { padding: 2px; border:solid 1px #cccccc; background-color: #ffffff; } p { margin-top: 20px; margin-bottom: 5px; text-align: justify; margin-right: 0px; margin-left: 0px; padding-right: 15px; padding-left: 15px; } /* basic links on the site */ * html p{ padding-left: 8px; } #left p{ margin-bottom: 5px; text-align: justify; margin-right: 0px; margin-left: 0px; padding-right: 15px; padding-left: 0px; } h1{ font-family: "Century Gothic"; color: #FF9900; text-align: center; font-weight: bold; font-size: 18px; padding-top: 10px; } h2{ color: #e2292c; font-family: Arial; font-size: 17px; font-weight: normal; } h3{ color: #e2292c; font-family: Arial; font-size: 15px; font-weight: normal; }

Дело касается текста .. помещаю его в контейнер и он несколько выезжает за его пределы .. Конечно делаю отступы, ноо.... В общем то изначально левый блок <div id="left"> имеет 173 пикселя в ширину, но отчего то он кажется шире, хотя картинки в нем именно 173 пикселя в ширину. почему так это первый вопрос?! И Естественно исходя из того что "left" шире и отступы для него делаю отдельно, но как ни делаю раскладка рушится потому что правый блок в ие6 постоянно уезжает вниз или некрасиво вылезает бэкграунд картинка большого контейнера.. подскажите Как решить эту проблемку ?! Ссылочки на макет нет так как пока все делаю локально .. В Css не спец. Спасибо за ответики <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=<?php echo _ISO; ?>" /> <link rel="stylesheet" href="css2.css"> </head> <body> <div align="center" id="body"> <div id="main"> <div id="logo"></div> <div id="top">top top top top top top top top top </div> <div id="top1">top top top top top top top top top </div> <div id="container"> <div id="contmenu"> <div id="contmenuleft"></div> <div id="contmenuright"></div> </div> <div id="conttop"> </div> <div id="contcenter"> <div id="left"> <div class="module"> <div> <div> <div> <div id="leftinner"> <h1>dfgdfg</h1> <p>dfgdffffffffffffffffffffff dfgdfgdfgdfgdfgdffffffffffffffffffff gdfgfdfgdfgfgdffdgretreyytrytry fffffffffffffffffffffffffffffffffffffffffffffffff rrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrrr ttttttttttttttttttttttttfdggggggggg rrrrrrrrrrrrrrrrrrrrrrrrrrrrh hhhhhhhhhhhhhhhhhhhhhhh ttttttttttttttttttttttttt</div> </div> </div> </div> </div></div> <div id="center"><div id="main_body"> <div class="module1"> <div> <div> <div> <h1>dfgdfgfgdfg</h1> <p>dfgdffffffffffffffffffffff dfgdfgdfgdfgdfgdffffffffffffffffffff gdfgfdfgdfgfgdffdgretreyytrytry fffffffffffffffffffffffffffffffffffffffffffffffff rrrr22222222222222222 <p>222222222222222222222 22222222222222222 rr22222222222222222 <p>222222222222222222222 22222222222222222 <p>rr22222222222222222 222222222222222222222 22222222222222222 rr22222222222222222 222222222222222222222 22222222222222222 ttttttttttttttttttttttttt </div> </div> </div> </div> </div></div> <div id="right"> <div class="module2"> <div> <div> <div> <div id="rightinner"> <h1>dfgdfg</h1> <p>dfgdffffffffffffffffffffff <br >dfgdfgdfgdfgdfgdffffffffffffffffffff <br >d333333333333333333333333 <br >d33333333333333333333333333 <br >d33333333333333333333333333 <br >d 3333333333333333333333333333 <br >d 3333333333333333333333333333 <br >d 3333333333333333333333333333 </div> </div> </div> </div> </div></div> </div> <div id="contbottom"></div> </div> <div id="footer1">footer"footer"footer"footer"footer"footer"footer"footer"footer"footer"footer"footer"</div> <div id="footer">footer"footer"footer"footer"footer"footer"footer"footer"footer"footer"footer"footer"</div> </div> </div> </body> </html> /* CSS Document */ html { height: 100%; } body { height: 100%; margin: 0px 0px 0px 0px; background-color:#FFFFFF; font-family: "Century Gothic"; font-size: 10px; color: #000000; } .clr { clear: both; } #logo { background-image: url(images/2.jpg); background-repeat: no-repeat; height: 81px; width: 925px; } #main { width:925px; } #main_body { float: left; width:450px; text-align:left; background-color: #F9F7F7; } #main_body2 { float: left; width:700px; text-align:left; padding: 8px 8px 8px 8px; } #center { float: left; width:450px; height:100%; } #center2 { float: left; width:700px; height:100%; } #left { float: left; width:173px; height:100%; text-align:left; background-color: #F9F7F7; margin-left: 30px; margin-top: 10px; } * html #left{ margin-left:10px; } #right { float: right; width:202px; height:100%; text-align:left; color:#FFFFFF; margin-right: 30px; } #rightinner { margin-right: 0px; margin-left: 0px; padding-top: 80px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; height: 100%; background-image: none; color: #666666; } #leftinner{ margin-left: 0px; padding-right: 15px; padding-bottom: 0px; padding-left: 5px; height: 100%; background-image: none; color: #666666; width: 130px; } * html #right{ margin-right:15px; } #container { width:905px; height: 100%; } #contmenu { float: left; width:925px; color:#FFFFFF; height: 58px; } #contmenuleft { float: left; height: 58px; background-image: url(images/1_08.jpg); background-repeat: no-repeat; width: 300px; margin-left: 15%; padding:0; } * html #contmenuleft{ margin-left: 10%; } #contmenuright { float: right; height: 58px; background-image: url(images/1_06.jpg); background-repeat: no-repeat; width: 216px; margin-right: 20%; padding:0; } * html #contmenuright{ margin-right:10%; } #conttop { width:905px; background-image: url(images/1k_03.jpg); background-repeat: no-repeat; background-position: center top; height: 48px; float: left; } #contcenter { width:905px; background-image: url(images/1_05.jpg); background-repeat: repeat-y; height:100%; background-position: center top; z-index: -2; float: left; margin: 0px; padding: 0px; } #contbottom { width:905px; background-image: url(images/1k_26.jpg); background-repeat: no-repeat; background-position: center bottom; height: 49px; float: left; } #contleft { width:905px; height:100%; } #footer { float: left; width:925px; color:#FFFFFF; text-align:center; background-image: url(images/2_08.jpg); background-repeat: no-repeat; height: 125px; } #footer1{ float: left; width:925px; background-color:#FFFFFF; color:#FFFFFF; text-align:center; background-image: url(images/12_27.jpg); background-repeat: no-repeat; height: 99px; } #footer a { color:#FFFFFF; font-weight:bold; } #top { float: left; width:925px; background-image:url(images/1.jpg); line-height:36px; text-align:left; height:211px; background-repeat: no-repeat; } #top1 { float: left; width:925px; background-image:url(images/12.jpg); line-height:36px; text-align:left; height:121px; background-repeat: no-repeat; } .modulecont { padding: 0; margin: 0 0 0 0; width: 925px; z-index: -1; } .modulecont div { padding: 0; margin: 0; background-image: url(images/1_05.jpg); background-repeat: repeat-y; background-position: center top; z-index: -1; } .modulecont div div { padding:0; background-color: transparent; background-image: url(images/1_032.jpg); background-repeat: no-repeat; background-position: center top; z-index: -1; } .modulecont div div div { text-align: center; padding: 0px 0 0px; background-color: transparent; background-image: url(images/1korp_27.jpg); background-repeat: no-repeat; background-position: center bottom; z-index: -1; } .module { padding: 0; margin: 0 0 0 0; width: 173px; z-index: 1; } .module div { padding: 0; margin: 0; /*bottom 14px*/ background-image: url(images/1korp_07.jpg); background-repeat: repeat-y; background-position: center top; z-index: 1; width: 173px; } .module div div { padding:0; background-color: transparent; background-image: url(images/1korp_03.jpg); background-repeat: no-repeat; background-position: center top; z-index: 1; width: 173px; } .module div div div { text-align: center; padding: 0px 0 20px; background-color: transparent; background-image: url(images/1korp_17.jpg); background-repeat: no-repeat; background-position: center bottom; z-index: 1; width: 173px; } .module1 { padding: 0; margin-top: 10px; width: 443px; margin-right: 15px; margin-bottom: 10px; margin-left: 15px; z-index:2; } * html .module1{ margin-left: 1px;; } .module1 div { background-image: url(images/1korp_08.jpg); background-repeat: repeat-y; width: 443px; padding-top: 0; padding-right: 0px; padding-bottom: 0; padding-left: 0px; margin-top: 0; margin-right: 0px; margin-bottom: 0; margin-left: 0px; z-index:2; } .module1 div div { padding:0; background-color: transparent; background-image: url(images/1korp_05.jpg); background-repeat: no-repeat; background-position: center top; width: 443px; z-index:2; } .module1 div div div { text-align: center; padding: 0px 0 20px; background-color: transparent; background-image: url(images/1korp_21.jpg); background-repeat: no-repeat; background-position: center bottom; width: 443px; z-index:2; } .module2 { padding: 0; width: 202px; margin-top: 10px; margin-bottom: 0px; margin-left: 0px; z-index:3; } .module2 div { padding: 0; margin: 0; /*bottom 14px*/ background-image: url(images/1korp_15.jpg); background-repeat: repeat-y; background-position: center top; width: 202px; z-index:3; } .module2 div div { padding:0; background-color: transparent; background-image: url(images/1_11.jpg); background-repeat: no-repeat; background-position: center top; width: 202px; z-index:3; } .module2 div div div { text-align: center; padding: 0px 0 20px; background-color: transparent; background-image: url(images/1korp_19.jpg); background-repeat: no-repeat; background-position: center bottom; width: 202px; z-index:3; } /** old stuff **/ body { padding: 0px; font-family: "Century Gothic"; line-height: 120%; font-size: 11px; color:#CCCCCC; } /* basic links on the site */ a:link, a:visited { color: #e2292c; text-decoration: none; font-weight: normal; } a:hover { color: #e2292c; text-decoration: underline; font-weight: normal; } a.footer:link, a.footer:visited { color: #626262; text-decoration: none; font-weight: normal; } a.footer:hover { color: #626262; text-decoration: underline; } .inputbox { padding: 2px; border:solid 1px #cccccc; background-color: #ffffff; } p { margin-top: 20px; margin-bottom: 5px; text-align: justify; margin-right: 0px; margin-left: 0px; padding-right: 15px; padding-left: 15px; } /* basic links on the site */ * html p{ padding-left: 8px; } #left p{ margin-bottom: 5px; text-align: justify; margin-right: 0px; margin-left: 0px; padding-right: 15px; padding-left: 0px; } h1{ font-family: "Century Gothic"; color: #FF9900; text-align: center; font-weight: bold; font-size: 18px; padding-top: 10px; } h2{ color: #e2292c; font-family: Arial; font-size: 17px; font-weight: normal; } h3{ color: #e2292c; font-family: Arial; font-size: 15px; font-weight: normal; }

Решил проблемку самостоятельно ..пардон за беспокойство

попробую описать проблемку ...проблема в центре макетика ... есть три прямоуголоьной части как с которыми проблемм нет (спозиционированы флоутами) , но они лежат внутри серой закругленной части выполненой по такой же конструкции, при помещении их внутрь этой серой прямоугольной части макетик сразу теряет сколь угодно привлекательный внешний вид и выглядит совсем не так как надо .. Все три части Выполнены при помощи такой конструкции: .module { padding: 0; margin: 0 0 0 0; width: 173px; } .module div { padding: 0; margin: 0; /*bottom 14px*/ background-image: url(images/1korp_07.jpg); background-repeat: repeat-y; background-position: center top; } .module div div { padding:0; background-color: transparent; background-image: url(images/1korp_03.jpg); background-repeat: no-repeat; background-position: center top; } .module div div div { text-align: center; padding: 0px 0 20px; background-color: transparent; background-image: url(images/1korp_17.jpg); background-repeat: no-repeat; background-position: center bottom; } Как сделать так чтобы три закругленных прямоугольных части нормально уложились внутри серой выступающей в качестве контейнера?? Возможно ли это или нужно использовать другой прием?? .. . Заранее спасибо

В общем я начинающий..знаю тока основы..желания верстать куча а вот опыта пока к сожалению нет совсем.. есть макетик .. фиксированной ширины 900. по высоте 100 проц. 2х колоночная верстка .. Завалился сразу же как начал.. осн проблема с которой столкнулся 1. фоновая картинка должна повторятся по правому краю шаблона а не экрана ( как сейчас) 2. хочется каким нить образом присандалить footer к низу а не за содержимым колонок если что то непонятно дайте знать... Благодарю за содействие .. <html> <head> <title>9</title> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> <link rel="stylesheet" href="css\css.css"> </head> <body> <div id="main"> <div id="logo"></div> <div id="top">weterghfhgfjfghjghfjg dgrfhtrhutyu tryutryutyrutu</div> <div id="left">dfghfghgfhf fdghfgdhgfhgfh</div> <div id="right">dfjhkgdfjhklgfklgfdklgdfkkgdfgdfklgdfkljgfdk fdgfjkgfdkgfdkgdfjklgdfj;klgsdfj;klgdfj;klgdf gdfjklgdfj;kgdfjklgdfjklgdfjklgdf</div> <div id="footer">ывапппппппппппыв</a></div> </div> </body> </html> вот css html { height: 100%; } body { height: 100%; margin: 0px; width: 900px; } #main { height: 100%; background-color:#FFFFFF; background-image:url(../images/4.jpg); background-repeat:repeat-y; background-position:right; } #logo { background-image: url(../images/logo.jpg); background-repeat: no-repeat; background-position: center; height: 314px; } .clr { clear: both; } #footer { background-image: url(../images/footer.jpg); background-position: center; background-repeat: no-repeat; height: 84px }Код

вот чёрт .. помощь так нужна но проблема в том что решил шаблон забабахать на ЦМС жумла и некоторые css-стили там формируются php модулями выводящимися в соответствующей позиции. То есть основа-разметка страницы (дивы или таблица) нормальные, а остальное при помощи отдельных стилей (если интересно описание стилей тут http://help.joom.ru/content/view/42/11/). Если что нить поймёте буду рад помощи.. В общем данная трехколоночная верстка мне подходит.Я очень многово ещё сам непонимаю в данной верстке. Код частично переделан мною.Лишнее удалил Естественно опыта нет и начались проблемы : текст в левом меню (.mainlevel) отчего та не позиционируется как justifi в правом диве выводится меню-список (.mostread) и почему то в ИЕ6 съезжает вниз. прочитал что проблема со списком но незнаю что в нем изменить И в ИЕ отчего то вся верстка спозиционированная поцентру прибилась к левому краю..в ост браузерах как надо по центру Сss еще не далеко недоделан .пока такие проблемки <head> <meta http-equiv="Content-Type" content="text/html; <?php echo _ISO; ?>" /> <link href="<?php echo $mosConfig_live_site;?>/templates/<?php echo $mainframe->getTemplate(); ?>/css/template_css.css" rel="stylesheet" type="text/css" /> <link rel="shortcut icon" href="<?php echo $mosConfig_live_site;?>/images/favicon.ico" /> </head> <body> <div id="container"> <div id="innerbox"> <div id="leftinner"> <div id="headerbox"> <div id="headmenu"></P> </div> </div> <div id="topbox"> </div> <div id="pathbox"></div> <div id="leftbox"> <div id="leftmenu"><div id="leftmenubox"> </div></div> <div id="mainbox"> <div id="maincontent"> <div id="maininner"> <?php mosMainBody(); ?> </div></div> <div id="newsbox"> <div id="news1"></div> <div id="news2"></div> </div> </div> <div id="rightinner"> <div id="rightmenubox"> </div></div> </div> </div> <div id="clearbox"></div> <div id="footerbox"> <div id="madeby"> <div align="left">| Design by <a href="http://www.dharc.de" target="_blank">dharc</a> |</div></div> <div id="version"> <div align="right">| Version 1.0 |</div></div> <center> <?php echo ("<div class=\"small\">"); $tend = mosProfiler::getmicrotime(); $totaltime = ($tend - $tstart); printf ("Diese Seite wurde in %f Sekunden generiert", $totaltime); echo ("</div>"); ?> </center> </div> </div> </div> </body> </html> —————————————————————- css ——————————————————————- html { margin-bottom: 1px; height: 100%!important; } body { min-height:101%; padding: 0; font-family: "Century Gothic"; font-size : 11px; margin: 0px; background-color: #FFFF00; color: #FFFFFF; } #header { width:100%; height:289px; position:absolute; top:0; left:0; } #headerbox { height:289px; width: 1023px; background-image: url(../../dj/images/index_03.jpg); background-repeat: no-repeat; margin-left: 5px; } #headmenu { height:100px; width: 500px; margin-left: 400px; padding-top: 20px; padding-right: 10px; padding-bottom: 20px; padding-left: 10px; } #footerbox { height: 325px; background-image: url(../../dj/images/index_06.jpg); background-repeat: no-repeat; background-position: center; width: 1023px; margin-top: 20px; margin-left: 5px; } #footer { left:0; height: 325px; width:1000px; bottom:0; color: #FFF; background-color: #333; } #container { width: 1030px; background-color: #000000; margin-left: auto; margin-right: auto; } #leftmenu { width: 180px; margin-left: 0px; float: left; } #leftbox { width: 1030px; margin-left: 5px; margin-top: 5px; } #mainbox { width: 600px; float: left; margin-left: 30px; } #maincontent { margin-top: 5px; margin-right: 5px; margin-bottom: 5px; margin-left: 5px; } #maininner { margin-left: 5px; margin-right: 5px; } #rightinner { width: 200px; margin-top: 5px; margin-right: 5px; float: right; } #rightmenubox { margin: 5px; } #news1 { width: 45%; float: left; margin-top: 5px; margin-right: 5px; margin-bottom: 5px; margin-left: 5px; } #news2 { width: 45%; float: right; margin-top: 5px; margin-right: 5px; margin-bottom: 5px; margin-left: 5px; } #clearbox { clear: both; } #madeby { font-family: "Century Gothic"; font-size: 11px; color: #000000; width: 100px; height: 20px; margin-top: 20px; margin-left: 10px; float: left; } #version { font-family: "Century Gothic"; font-size: 11px; color: #000000; width: 100px; height: 20px; margin-top: 20px; margin-right: 10px; float: right; } #pathbox { background-color: #000000; } /*ссыLко и менюшке цвета и афармление*/ #headmenu .mainlevel-nav { display: inline; font-size: 10px; font-weight: bold; font-family: "Century Gothic"; text-align: left; height: 50px; text-decoration: none; margin-top: 1px; margin-bottom: 1px; padding-left: 30px; background-position: 15px 9px; background-image: url(../../dj/images/ic.jpg); background-repeat: no-repeat; padding-bottom: 55px; padding-right: 5px; } a.mainlevel-nav { text-decoration: underline; color: #FF0000; } a.mainlevel-nav:hover { text-decoration: underline; color: #FFFFFF; } a.mainlevel-nav#active_menu { color: #333; } .pathway { padding-left: 5px; font-family: "Century Gothic"; font-size: 10px; color: #FFFFFF; text-decoration: none; background-color: #000000; letter-spacing: 1px; word-spacing: 10px; } .mainlevel { font-family: "Century Gothic"; font-size: 10px; color: #FFFFFF; text-decoration: none; background-color: #000000; padding-right: 5px; padding-bottom: 5px; padding-left: 25px; letter-spacing: 1.5px; word-spacing: 5px; text-align: center; } .mainlevel:hover { font-size: 10px; color: #FFFF00; text-decoration: none; } #leftmenu { background-color: #000000; } ul { list-style: square; list-style-position: outside; } .mostread { font-family: "Century Gothic"; font-size: 10px; color: #FFFFFF; text-decoration: none; background-color: #000000; letter-spacing: 1.5px; text-align: right; } a.mostread:hover { font-size: 10px; color: #FFFF00; text-decoration: none; } #maininner { font-family: "Century Gothic"; font-size: 10px; color: #FFFFFF; text-decoration: none; background-color: #000000; letter-spacing: 1.5px; text-align: justify; }

в вёрстке я неспец пока что поэтому поясню проблемку . поглядел ваши ссылочки уважаемый rus . Спасибо. только у меня чуточку другая ситуация. в хэдэре и футере у меня большие по высоте картиночки в бэкграунде. поэтому вариант без скролла неконает так ккак правая и левая колоночки уходят под футер и содержимого их невидно.. Неподскажете Как решить проблемку?