gard
-
Posts
37 -
Joined
-
Last visited
gard's Achievements
Explorer (1/14)
0
Reputation
-
Вроде бы решил проблему, добавив float: left; для ul > li меню слева. После этого вылезла другая проблема с контентом в середине, если там был блок с clear: both; то после него все падало ниже нижнего уровня меню. Проковырялся часа два и плюнул, придется как то это дело обходить.
-
Вот сделал скрин, использую в Firefox WebDeveloper, там есть подсветка блока при наведении на него, красным выделен блок main, который имеет серый border и после которого уже должен идти footer. Подсветка показывает как оно должно быть, но на деле почему то по другому.
-
Пробовал, вообще странная очень верстка, потому что блоки определяются пустыми сначала и идут не по порядку (взято с шаблонов), к примеру так: <div class="main clear"> {global_content name="2011_menu_topWorld"} <div class="stage4col clear"> </div> <div class="LeftCol"> {global_content name="2011_menu_leftVwMagazine"} </div> <div class="container"> <!-- <div class="stage3col"> </div> <div class="RightCol "> <div class="interest_materials"> <div class="simple_text" > <p><strong></strong></p> </div> <div class="one_material"> <img src="/vw/images/world/301.jpg" alt="" title="" border="0" height="102" width="215"> <p><strong></strong></p> <p></p> <p><a class="forward" href="/vw/booklets/magazine/.pdf">Скачать (PDF)</a></p> </div> </div> </div> clear как раз и означает clear: both;
-
Привет всем! На примере странички http://www.vw-ntagil.ru/index.php?page=vwMagazine Никак не могу понять почему, если с блоке content (по центру) наполнения меньше, чем по боковым столбцам или оно отсутствует, то боковые столбцы блоком main просто съедаются. Верстка не моя, долго ковырялся, прописывал height: 100%; для всех колонок, но не помогает, пробовал менять overflow для main, все равно нет эффекта, рисует скроллинг сбоку и помещает контент в себя, а высота остается маленькой.. Помогите, если не трудно, основной .css это style.css. Поделиться исходниками не могу, только в таком виде.. я уже весь мозг сломал. =)
-
Это точно =)
-
Спасибо большое! Вот что значит знания. Все работает! =)
-
Ну никак не могу побороть эту проблему, на сайте много страниц должно быть в виде: картинка слева - текст справа (список, список и текст..) и наоборот.. сейчас есть почти тот же CSS .imgtext { clear: both; overflow:hidden; ~border: 1px solid #ccc; margin: 10px 0px 5px 0px; padding: 0; } .imgtext > img{ ~display: block; float: left; margin: 5px 7px 0px 0px; padding: 0; } .imgtext .text{ ~width: 626px; ~display: block; float: left; margin: 0; padding: 0; } Который используется так: <div class="imgtext"> <img src="..."> <div class="text"><p>.......</p><p>....</div> </div> И вот, что я заметил.. Интересно то, что так блок text падает под картинку (img float: left; display: block;), но если в блоке text содержится строка, умещающаяся в 1ну без переносов - блок становится рядом как и определено. Мне нужно расположить два блока рядом без задания их ширины, к слову, если задать ширину явно - все тоже прекрасно работает, или если задать display: table; для .text.. но не все IE его не понимают как я знаю... подскажите почему при простых display: block; вытекающих из float: left; блок .text падает под картинку если в нем строка требует перевода и не влазит в одну строку..
-
Проверил, все нормально с > .. уже не наю в чем может быть проблема.. ну ладно, бду заниматься дальнейшими делами, на крайний случай - сделаю таблицей и всего делов
-
Спасибо за ответы.. сейчас попробую посмотреть нет ли лишних > .. хотя это вряд ли.. как сделать более просто пока не осознаю ))) ps: доктайп <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> Firefox 3.6.8
-
Здравствуйте снова! =) У меня опять вопросик.. как то так вышло, убрал один враппер (как оказалось ненужный див.. ) и что-то съехало, начал поправлять и наткнулся на интересный момент.. сейчас есть CSS: #footer{ margin:13px auto 0px auto; padding: 0px 13px 0px 13px; position: relative; clear: both; width: 992px; height: auto; background-color: #fff; ~border: 1px solid #000; font-size: 10px; line-height: 11px; } /* FOOTER CONTENTS */ #footer > p{ margin: 0px 0px 13px 0px; padding: 0; text-align: justify; clear: both; color: #777; } #footer > .imgtext { width: 100%; height: 100%; clear: both; overflow:hidden; background-color: #ccc; margin: 0px 0px 8px 0px; } #footer > .imgtext > img{ width: auto; height: 100%; display: block; float: left; } #footer > .imgtext > .text{ float: left; width: 876px; height: 100%; padding: 0px 0px 0px 7px; background-color: red; } #footer > .imgtext > .text > p{ margin: 0px 0px 2px 0px; color: #777; } /* /FOOTER CONTENTS */ Использую так: <div id="footer"> <div class="imgtext"> <img src="Claim_dark_grey_on_white_01.gif"> <div class="text"> <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</p> <p>Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s</p> </div> <!--<div style="clear:both"></div>--> </div> <p>На иллюстрациях может быть изображено дополнительное оборудование.</p> <p>Материалы, размещенные на данном Сайте, предназначены для клиентов Opel в Российской Федерации и не могут быть применены вдругих странах. Opel будет прилагать все усилия, чтобы обеспечить точность и актуальность данных, содержащихся на Сайте, однако Opel не несет никакой ответственности в отношении любых претензий или убытков, понесенных в связи с использованием информации, размещенной на Сайте. Opel оставляет за собой право в любое время вносить изменения в перечень и спецификацию продукции. Для получения действительной информации о продукции просьба обращаться к официальным дилерам Opel.</p> </div> И вот интересность в том, что если явно не задать для #footer > .imgtext > .text ширину width: 876px;, то блоки #footer > .imgtext > img и #footer > .imgtext > .text не встают рядом, а располагаются друг под другом, хотя указан float.. В чем может быть причина? Ведь не всегда заранее известна ширина. Заранее благодарен за участие. =)
-
Ul Li Display: Inline; - Отступы При Использовании Бэграунда
gard replied to gard's question in HTML Coding
Да, я его для ссылки сделал.. -
Ul Li Display: Inline; - Отступы При Использовании Бэграунда
gard replied to gard's question in HTML Coding
Прошу прощения, уже разобрался =) Работат.. Применил для li display: block; float: left; и для a display: block; -
Здравствуйте! Подскажите по ситуации, имею CSS: #maincontent > .sectionmenu { position: relative; margin: 0px 0px 0px 1px; padding: 0; width: 990px; height: 23px; border-top: 1px solid #000; border-bottom: 1px solid #000; } #maincontent > .sectionmenu.shadowline{ ~height: 9px; margin: 0; padding: 0px 0px 9px 0px; background: #fff url(/shdw3.png) top left no-repeat; } #maincontent > .sectionmenu ul{ background-color: #fff; margin: 0; padding: 0; height: 23px; } #maincontent > .sectionmenu ul li{ list-style: none; ~display: inline; background-color: #dedede; color: #333; padding: 0px 5px 0px 5px; margin: 0; font-size: 11px; line-height: 23px; height: 23px; } #maincontent > .sectionmenu ul li:hover{ background-color: #ccc; } На странице использую так: <div id="maincontent"> <div class="sectionmenu"> <ul> <li><a href="#">Ladders & Sticks</a></li> <li><a href="#">Hurdles</a></li> <li><a href="#">Training Accessories</a></li> <li><a href="#">Smart-Cart Training System</a></li> <li><a href="#">Smart-Hurdle Collection</a></li> <li><a href="#"> - VIEW ALL - </a></li> </ul> </div> </div>Проблема в том, что когда для li указано display: inline; то возникают непонятные отступы как бы внутри (без расширения самого li), и при наведении на li область ссылки закрашивается не полностью, а как бы прямоугольником по центру..
-
Ну тут цже ему правда глаза колет =)
-
В том и прикол, что за свечки в храме они цены ломят, а за сайт отдать 55к легко.. и довольны до ..кхм..