Yahoo!

Вот пробую сделать страничку, и столкнулся с проблемой, не могу убрать линию под дивом с надписью "тарам" , чтобы было типо вкладки, на сайте просматрел про параметр display: inline но он не срабатывает. Помогите, пожалуйста, уже непервый день над этим думаю:/ (про чистоту кода можете ничего мне не говорить, позже исправлю=) ) CSS: *:focus {outline: none} body { font-family: arial; font-size: 13pt; } html,body,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,p,form,fieldset,legend,input,img { margin: 0; padding: 0; } div { margin: 0; padding: 0; position: relative; } #page { width: 100%; height: 100%; } #head { width: 100% } #body { margin: 10px 0 } #footer { background: #F2F5F7; } #left_col { width: 18%; float: left; } #centr_col { width: 65%; float: left; display: block; } #right_col { width: 17%; float: left; } #centr { margin: 0 25px; } #catalog { border-top: solid 1px #2B5A85; padding-top: 5px; width: 100%; font-size: 12pt; margin: 0 0 1em 0 } .clear { clear: both; } .yacheika { height: 100%; padding: 5px; background: #fff; margin-top: 6px; } .yacheika, .yacheikanone { border: 1px #2B5A85 solid; border-bottom: none; padding: 3px; float: left; margin-left: 5px; display: inline; white-space: nowrap; } .yacheikanone { background: #2B5A85 url('file:///C:/Documents and Settings/СЕРЕГА/Рабочий стол/menu2.png') repeat-x; color: #EBF0FC; margin-top: 6px; } #pixel { margin-left: 10px; min-width: 80px; } #pixelb { min-width: 130px; } #floatb { float: right; margin-top: 11px } #left_cat { float: left; width: 33.3%; } #centr_cat { float: left; width: 33.3%; } #right_cat { float: left; width: 33.3%; } HTML: <div id="page"> <div id="head"> голова </div> <div id="body"> <div id="left_col"> левая колонка </div> <div id="centr_col"> <div id="centr"> <div id="navigation">Вы находитесь: <span id="bold">главная</span></div> <p id="pixel" class="yacheika">тарам</p> <div id="pixelb" class="yacheikanone"><a title="Kinderspiele" id="yach" href="#">пам</a></div> <div id="floatb"><a title="Kinderspiele" id="kinderspiele" href="#">пам</a></div> <div class="clear"></div> <div id="catalog"> <ul id="left_cat" class="linone"> <li>а</li> <li>б</li> <li>в</li> <li>г</li> </ul> <ul id="centr_cat" class="linone"> <li>д</li> <li>е</li> <li>ё</li> <li>ж</li> </ul> <ul id="right_cat" class="linone"> <li>з</li> <li>и</li> <li>й</li> <li>к</li> </ul> <div class="clear"></div> </div> </div> </div> <div id="right_col"> правая колонка </div> <div class="clear"></div> </div> <div id="footer"> футер </div> </div>

увы...=(( с вашим кодом левая колонка накрывает центральную... и... есть русские сайты=)), а то у меня плохо с английским

да

Реально ли вообще так сверстать? Я хочу чтобы у меня было три колонки и все три резиновые, при сужений одна (например правая) прекращала сужаться (min-width: xxxpx), а другие продолжали. При сужений, когда левая прекращает сужаться, правая, при одном решений проблемы, накрывает центральную, либо, при другом решении, сталкивает центральную в "унитаз" =). Есть решение, чтобы этого не было, а колонки продолжали взаимно, не мешая друг-другу сужаться?? И если уже на то пошло, таблицами можно такую задачу сделать?

Вот короче сверстал небольшой макет http://golby.my1.ru Хаки это зло, но здесь для IE по-моему без них не обойтись, или всё же есть способ обойтись без них

Нереально? Всё же HTML <div id="page"> <div id="left"></div> <div id="left_all"></div> <div id="center">Тянущийся контент</div> <div id="right_all"></div> <div id="right"></div> </div> CSS #page { width: 85%; position: relative; background: red; margin: 0 auto; } #left { position: absolute; background: green; width: 30px; top: 0; left: 0; height: 100%; } #left_all { position: absolute; background: blue; width: 20px; top: 0; left: 30px; height: 100%; } #center { margin: 0 50px; background: pink } #right_all { position: absolute; background: blue; width: 20px; top: 0; right: 30px; height: 100%; } #right { position: absolute; background: green; width: 30px; height: 100%; top: 0; right: 0; }

Всё ясно , таблицой сделаю.

Как так?? А тот метод, что по ссылке, может им можно??

А как сверстать это: http://s44.radikal.ru/i105/0811/d9/50f70d8650fe.jpg Надо чтобы весь контент ездил, внутри него только зелёный блок ездил, а остальные по бокам были фиксированы и не наезжали на него и не разваливались. Вот ещё некоторые параметры, весь контент имеет ширину к примеру 85%; левая синия 30px; левая красная 40px; и зеркально 40px; 30px Пробовал позитион абсолите - наезжают; Пробовал поситион релатив - разваливаются; -- Вычитал в инете имитацию абсолютного позиционирования - не понял , ссылка: http://www.getincss.ru/2008/06/25/novaya-t...aniya/#more-175 Объсните!!

Я думал рисовать по частям, контент один рисунок, блоки от меню один, body-background другой. А потом накладывать друг на друга, у меня это удалось, но изображения почему-то остались непрозрачными. Это на будущее заготовил . Так сказать цензура. Не обращайте внимание.

Вот сайт http://golby.my1.ru/ , ни на что не обращайте внимание, кроме непрозрачности левой и правой тени от контента. И меню навигации. Вопрос скорей по фотошопу(чего только не делал), чем по вёрстке.

Можно ли растянуть фоновый рисунок вообще!!!

Эй! Вы чего, ладно, футер убрал, позднее разберусь, но эти серые квадраты (в будущем рисунки) в эксплорере не хотят вставать, не знаю что и делать. Как сделать, чтобы отображалось как и в файрфоксе

Спасибо, всё же сделал тем методом, который по ссылке я показывал, но переверстав страницу уже применяя относительные размеры и применяя абсолютное позиционирование, сложились два вопроса: 1) Как сделать так, чтобы при сужений окна браузера, вначале стягивался пробел между самим контейнером и левыми, правыми отступами, а уже потом в самом контейнере. 2) Вот сайтик, только что зарегистрировался http://golby.my1.ru/, в фаире он лучше всего смотрится, как добиться этого и в других браузерах, особенно в эксплорере, эти серые квадраты (в которых в будущем будет закругление) только в фаире нормально встали, и ещё проблема с футером, это он нормально отображается только потому что я ему задал bottom: 300px, а если сделать меньше то фиг и то если наполнить блоки навигации то всё пипец, все методы которые знаю испробовал - бесполезно, и его не корректная ширина, видна не вооружённым глазом/

Ну вот: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>3 êîëîíêè</title> <style type="text/css"> .body {margin: 0px; padding: 0px} .glav {width: 1024px; margin: 0 auto} .left_colon {width 350px; float: left; background: green} .center_colon {width: 500px; float: left; margin-left: 15px; background: red} .right_colon {width: 350px; margin-left: 15px; background: blue; float: left} </style> </head> <body> <div class="glav"> <div class="left_colon">Ëåâàÿ êîëîíêà</div> <div class="center_colon">Öåíòðàëüíàÿ êîëîíêà</div> <div class="right_colon">Ïðàâàÿ êîëîíêà</div> </div> </body> </html> И мне надо, чтобы правая колонка имела ширину не которую я ей задам строго, а она сама растягивалась до конца правого края главного слоя.

Вот есть у меня главный слой. В нём 3 колонки, 2 заданной ширины, а 3-я что бы сама растянулась на оставшееся место, а как - подскажите. Параметр height: 100% только переносит колонку на новую строку и растягивает во всю ширину главного слоя. height: auto растягивает колонку в зависимости от содержимого. А больше я незнаю чего бы применить.

Я спрашиваю на валидность, я то что код не доработан - он на стадии разработки, я не спорю. Просто и использую XHTML язык и спрашиваю вот .

Это я знаю, я поздней это исправлю. Я хотел бы узнать, кроме подвала всё нормально написал. И чтобы не "бросалось в глаза", скопируй код в блокнот или ещё куда-нибудь, у меня веб-эдитор, и посмотри в браузере. Vindex10, спасибо, но на такой пример я натыкался и ранее - у меня он не подействовал, футер понизился, но не до конца. Пример из этой ссылки мне кажется более надёжный http://www.zakharov.ms/footer/ и как я писал выше, я немного не догоняю, как вписать его у себя.

Тему новую не создавал... вот в общем <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/HTML4.01/frameset.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <meta http-equiv="content-type" content="text/css; charset=windows-1251" /> <meta name="decription" content="" /> <meta name="keywords" content="" /> <meta http-equiv="content-language" content="ru" /> <meta name="author" content="" /> <meta name="copyright" content="" /> <meta name="generator" content="" /> <style type="text/css"> body { margin: 0px; line-height: 135%; font-family: Arial; font-size: 12pt } .chief { margin-left: auto; margin-right: auto; width: 1024px; min-width: 700px; max-width: 1900px; } .logotip { width: 100% } a:hover { text-decoration: none; color: red } a:active { color: black; } a:visited { color: green } .body_suite { background: #000000; margin-top: 10px; margin-bottom: 10px; min-height: 100%; } .left_menu_suite { float: left; width: 200px } .center_suite { float: left; margin-left: 15px; width: 550px } .right_menu_suite { margin-left: 15px; float: right; width: 244px } .bottom_suite { border: 1px; border-style: solid; border-color: #E5E3E7; margin-top: 10px; width: 100%; padding: 5px; text-align: center; } .samanavidacia { background: #E5E3E7; padding-left: 15px; font-weight: bold; height: 25px; font-size: 12pt; } .menunavigation { border: 1px; border-style: solid; border-color: #E5E3E7; margin-bottom: 10px } .menunav { padding: 10px } .bzr { text-align: right; font-weight: normal; font-size: 11pt; margin-left: 30px } hr { color: #E5E3E7; height: 1px } .float { float: left } #gh { text-align: center } </style> <scripts language="java script"> <!-- var flag=false // флаг (триггер) function imgchange() { //обработчик щелчка на изображении if (flag) document.all.myimg.src = "C:/Documents and Settings/СЕРЕГА/Мои документы/Мои рисунки/logo.jpg" else document.all.myimg.src = "C:/Documents and Settings/СЕРЕГА/Мои документы/Мои рисунки/logo1.jpg" flag=!flag // изменяем значение флага на противоположное } //--> </script> </head> <body> <div class="chief"> <div class="logotip"><img border=0px width=284px height=77px alt="На главную страницу голби" src="C:/Documents and Settings/СЕРЕГА/Мои документы/Мои рисунки/logo.jpg" align="center" hspace=0 vspace=0 onmouseover = "imgchange()"></div> <div class="body_suite"> <div class="left_menu_suite"> <div class="menunavigation"> <div class="samanavidacia">Навигация</div> <div class="menunav">Заглавная страница<br /> Гостевая книга<br /> Форум<br /> Опросы<br /> Обратная связь<br /> Дневник сайта<br /> О сайте</div> </div> <div class="menunavigation"> <div class="samanavidacia">Опрос <span class="bzr">Другие</span></div> <div class="menunav"> <div>Как Вы попали на мой сайт?</div> <hr /> <div> <input type="radio" name="" value="">Через поисковик<br /> <input type="radio" name="" value="">Ссылка с другого сайта<br /> <input type="radio" name="" value="">Посоветовали<br /> <input type="radio" name="" value="">Чисто случайно<br /> </div> <hr /> <div id="gh"><button>Проголосовать</button><br /><button>Результаты</button><br />Обсудить опрос</div> </div> </div> <div class="menunavigation"> <div class="samanavidacia">Статистика</div> <div class="menunav"> В данный момент Гостей:<br />Пользователей:<br />Всего:<br /> <hr /> Сегодня было:<br /> Вчера было<br /> <hr /> Сайту: <hr /> Баннеры </div> </div> </div> <div class="center_suite">Новости сайта</div> <div class="right_menu_suite"> <div class="menunavigation"> <div class="samanavidacia">Вход <span class="bzr">Зарегистрироваться</span></div> <div class="menunav"> <div class="float"> Логин:<br /> Пароль: </div> <div> <input name="login" value=""> <input type="password" name="password" value=""> </div> <div><input type="checkbox" name="zapomnit" value="" checked="checked">Запомнить вас <button>Войти</button></div> <hr /> <div>Забыли пароль? <br />Другие проблемы?</div> </div> </div> <div class="menunavigation"> <div class="samanavidacia">Календарь</div> <div class="menunav"></div> </div> <div class="menunavigation"> <div class="samanavidacia">Реклама</div> <div class="menunav"></div> </div> </div> </div> <div class="bottom_suite">Если вы заметили ошибку или у вас есть идеи для моего сайта, пожалуйста, напишите их по адресу <b>grey1994@gmail.com</b><br /> При перекопирований материала, активная ссылка <a href="http://www.golby.ru">www.golby.ru</a> обязательна.<br />(C)opiryght 2009 </div> </div> </body> </html> Подвал в фаире не лезет туда куда надо, в темах полазил, не понял. Ещё тот скриптик, я написал для того, чтобы при наведении курсора на логотип он менялся - не работает, помогите в чём пробел. Таблицами не хочу верстать. И ...проверьте код, кому не жалко, может чего надо исправить, пока не поздно.

Хмм... я в этом коде <br /> добавил... помоему только так.

Спасибо. Я так понимаю мой сайт должен находиться на веб-сервере, а если на локальном компьютере, то никак? — И ещё, вот только что зарегистрировал сайт на by.ru, как теперь его редактировать со своего компьютера, в сети нашёл только, как это делается в Макромедиа Д. И ... как забирать деньги?

Извините, конечно, что повторяю некоторые проблемы, но: Мозила фаир 3 не хочет отображать картинки, ИЕ отображает, искал решение, подсказали относительные папки и всё такое, помогите разобраться, допустим картика находиться тут: c:/www/images/picture.png (изначально так писал) то относительный адрес будет таков: images/picture.png (я так написал, картинка не отображалась) или каким адресом, если не трудно напишите. Заранее спасибо.