gard
-
Posts
37 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Everything posted by gard
-
Да , там нет верхнего меню.. щас поробую объяснить. Вот смотрите.. когда мы идем с главной в "О компании" то левое меню становится менюшкой о окмпании, меню главной страницы перемещается во "вкладку" Главная с подменю.. дальше идем в "новости", слева появляется меню новостей, а "О компании" встает вкладкой с подменю под "главная". .и так далее.. чем глубже мы опускаемся, тем больше ссылок на верхние уровни перемещается в эти вкладки.. Просто с точки зрения оптимальности хочется по другому, то есть если иметь список на внутренних, то получается - поправил в 1ом месте - правим в других. Хочется меню в одном файле, которое можно править и это отразится в пределах всех страниц..
-
Привет всем! Верстаю сайт дилера форд, информацию беру с официального сайта ford.ru, проблемка в том, что меню только слева и подменю отображается сверху с указанием верхлежащих разделов. Знающие люди - помогите, подскажите как подступиться к созданию такого меню.. Я смутно понимаю, что меню можно вписать в неки массив, который потом как то прикрутить к моим страничкам.. За вывод страниц у меня отвечает по сути только 1 файл (достался по наследству =), который берет информацию из каталогов и файлов в них. Меню у меня раскидано по 4-5 каталогов верхнего уровня, но я чувствую, что это уже неоптимально, долго в будущей правке, хочется сделать сразу нормально..
-
Ну на самом деле список и находится внутри этих дивов (указанны в рабочем варианте), но ведь правило .pimgli ul, ul.pimgli должно применяться (?) везде, независимо от текущего расположения элементов, то есть они могут быть в <body> а могут быть в девятидесяти дивах внутри..
-
А подскажите знающие люди.. почему такая конструкция не работает: .pimgli ul, ul.pimgli{ padding: 0px 0px 0px 20px; }А такая работает: .box.visible .pimgli ul, .box.visible ul.pimgli{ padding: 0px 0px 0px 20px; }То есть пока я явно не указал во что вложен класс .pimgli оно не работало..
-
Главное потом об этом не забывать Спасибо, что прояснили насчет списка, читать мне надо.. много и вдумчиво.
-
Знаю.. но там у меня гораздо больший код CSS.. пока делал все учитывать старался с отступами, все по пикселам до бордюрчиков.. так что оно работает вроде правильно.. правда в режиме совместимости в IE8 менюшка немного видоизменяется и табличка с галереей содержимое влево сдвигает, других багов вроде не замечено..
-
Спасибо за совет, в том месте, на подобие которого я верстаю вообще был не список и строки разделенные <br> получилось что-то типа inside.. А тут до меня дошло, что список очевидно не блочный элемент (?).. я просто честно говоря по CSS только "Шаг за шагом" прочел, книжки читать пока не успеваю.. Дак вот, я просто окантовал список дивом pimgli: .pimgli { overflow:hidden; margin: 0 1em 1em 0; padding: 0 3px 0 0; } .pimgli ul { padding: 0px 0px 0px 20px; } Картинка стала адекватной
-
Здравствуйте! Есть такая проблема: Обычно у меня идет картинка, справа от которой заголовок и параграф текста, а тут в параграфе еще и список, маркеры которого налазят на картинку.. попробовал уже margin-left, padding-left.. а ему все равно, как стоял так и стоит.. прошу помощи.
-
В IE6? (IE8 в режиме совместимости) съезжает часть страницы..
gard replied to gard's question in HTML Coding
А у меня указан.. я уже описал, эксполер просто "ест" тильды, которые я понаставил заместо комментариев, так быстро просто. . -
Здравствуйте! УЖЕ РЕШЕНО. Сверстал шаблон, сижу наполняю и вдруг думаю, что надо бы проверить еще и в IE в режиме представления совместимости и тут падаю в обморок. Все основное содержимое укатилось куда то вправо и вниз. Я далеко не специалист в IE6 и, честно говоря в CSS только только.. Помогите вычислить виновника.. Мой шаблон представляет из себя следующее: <div id="main"> <div id="logo"><img src="/images/logo.jpg" /></div> <div id="header"> <img id="headimg" src="/images/css/logo_orange_line.gif" height="8px" width="980px" border="0"/> </div> <!--Список левого нав. меню--> <div id="lplace"> <div class="wrap-navmenu-h"> {{LEFTMENU}} </div> <div class="wrap-navmenu-h"> {{LEFTMENUBOTTOM}} </div> </div> <!--/Список левого нав. меню--> <div id="slide"> <img src="{{SLIDE}}" /> </div> <div id="rplace"> <div id="content"> {{MAINCONTENT}} </div> <div id="rightcol"> {{RIGHTCOL}} </div> </div> <div id="footer"> {{FOOTER}} </div> </div>То есть основной блок main включает в себя: -logo -header -lplace (для меню) -slide (для картинки) -rplace (для основного контента под картинкой) |-content (сам основной контент) |-rightcol (колонка справа) -footer В двух словах все находится в main, в котором 2 важных блока - lplace & rplace, rplace делится на content (левая сторона rplace) и rightcol (правая сторона rplace). Вот CSS: #main { position: relative; /*Для абсолютного позиционирования лев/пр блоков, которые будут относительно оного*/ margin:0px auto 0px auto; width: 980px; height: 100%; padding: 0px; line-height: 0px;/*Без нее странные отступы над картин(кой/ами)*/ background-color: #fff; overflow: hidden; } #logo{ position: absolute; top: 20px; right: 0px; z-index:100; } #logo img{ margin: 0px; border: none; } #header{ top: 0px; left: 0px; margin: 0px; padding: 0px; border: none; float:none; } #lplace { position:relative; float:left; width: 200px; margin: 0px; padding: 0px; line-height: 15px; } #rplace { position: relative; float:right; width: 780px; margin: 0px; padding: 0px; line-height: 15px; } #slide { position: relative; float:right; width: 780px; margin: 0px; padding: 0px; line-height: 15px; } #content { position: relative; float:left; width: 570px; margin: 5px 5px 0px 5px; padding: 0px; line-height: 15px; } #rightcol { position: relative; float: right; width: 184px; margin: 5px 7px 0px 7px; padding: 0px; line-height: 15px; } #footer { width: 980px; margin: 5px 0px 0px 0px; clear: both; line-height: 15px; }Буду очень признателен за помощь.. Ой.. оказывается IE в режиме представления совмесимости обрабатывает строки в CSS за тильдой.. решилось! Урааа!
-
Спасибо за ответ, проблема решилась начаянно, вдруг на другом табе (вкладке) картинки выровнялись сами собой, оказалось виноват таб определенного класса.. блин я уже начинаю путаться.. В будущем поробую списками..
-
Здравствуйте! Никак не могу победить одну проблему.. есть блок, в котором размещены 4 блока, включающие в себя: 1) картинку, 2) текс под ней. Мне хочется, чтобы картинки в этих блоках выравнивались по центру. Для 4х блоков, включающих в себя картинки и текст установлена ширина 25%. Сам большой блок, который включает эти 4 блока имеет ширину 100%. Вот как это выглядит: Мне бы хотелось выровнять картинки внутри вышеописанных 4х блоков по центру. А то получается что у меня они все слева. Вот CSS: .lineimg { ~position: relative; width: 100%; margin: 5px 0px 0px 0px; padding: 0px; float: none; } .lineimg .lineimg_block { position: relative; padding: 0; float: left; width: 25%; margin: 0px 0px 0px 0px; ~text-align : center; } .lineimg .lineimg_block img { margin: 0; padding: 0; border: #777 solid 1px; display:block; margin:0 auto; } .lineimg .lineimg_block p { ~margin: 3px 0px 10px 0px; padding: 3px; font-weight: bold; color: #333; }.lineimg - самый большой блок (как враппер), в котором находятся блоки контента (картинка и параграф). В коде страницы использую так: <div class="lineimg"> <div class="lineimg_block"> <img src="/images/autos/focus/o21.jpg" /> <p>la lala lala lalal</p> </div> <div class="lineimg_block"> <img src="/images/autos/focus/o21.jpg" /> <p>la lala lala ala lala lalalla lala lala lalal lalal</p> </div> <div class="lineimg_block"> <img src="/images/autos/focus/o21.jpg" /> <p>la lala lala lalalla lala lala lalal </p> </div> <div class="lineimg_block"> <img src="/images/autos/focus/o21.jpg" /> <p>la lala lala ala lala lalalla lala lala lalal lalal</p> </div> </div>Буду очень признателен за помощь.
-
Вот, сразу видно - профессионалы! Спасибо большущее! Лекарство помогло. Теперь заливается полностью.
-
Блин ссылочку дать не могу, могу дать архив, если у вас есть куда закинуть каталог со страничкой.. А должно быть (или нет? оО) так, чтобы область заливалась фоновым цветом полностью а не с (примерно) середины и до низу..
-
Здравствуйте! Подскажите, вот воюю уже час наверное с одной проблемой и никак не могу ее побороть (CSS изучаю с неделю, если что- простите). Картина такая: Рамка - это границы блока при наведении, для этого блока производится заливка фоновым цветом, или я еще вставлял изображение, оно так же уезжает вниз. В качестве контента этого мелкого блока выводится прозрачное .png изображение 24*24px. Вот листинг всего большого блока, включающего блок tabs, в котором и творится непотребство: <div id="feature_list"> <ul id="tabs"> <li> <a href="java script:;"> <img src="/images/jq/click.png" width="24px" height="24px" /> </a> </li> <li> <a href="java script:;"> <img src="/images/jq/click.png" width="24px" height="24px" /> </a> </li> <li> <a href="java script:;"> <img src="/images/jq/click.png" width="24px" height="24px" /> </a> </li> <li> <a href="java script:;"> <img src="/images/jq/click.png" width="24px" height="24px" /> </a> </li> <li> <a href="java script:;"> <img src="/images/jq/click.png" width="24px" height="24px" /> </a> </li> <li> <a href="java script:;"> <img src="/images/jq/click.png" width="24px" height="24px" /> </a> </li> </ul> <ul id="output"> <li> <img src="/images/autos/focus/1.jpg" /> <a href="#">Узнать больше</a> </li> <li> <img src="/images/autos/focus/2.jpg" /> <a href="#">Узнать больше</a> </li> <li> <img src="/images/autos/focus/3.jpg" /> <a href="#">Узнать больше</a> </li> <li> <img src="/images/autos/focus/4.jpg" /> <a href="#">Узнать больше</a> </li> <li> <img src="/images/autos/focus/5.jpg" /> <a href="#">Узнать больше</a> </li> <li> <img src="/images/autos/focus/6.jpg" /> <a href="#">Узнать больше</a> </li> </ul> Отсюда нас интересует повторяющаяся часть: <li> <a href="java script:;"> <img src="/images/jq/click.png" width="24px" height="24px" /> </a> </li> click.png - то самое прозрачное изображение. Вот CSS (простите, много правок): /*Общие настройки доски*/ div#feature_list { width: 780px; height: 439px; overflow: hidden; position: relative; } /*все начинается с ul*/ div#feature_list ul { position: absolute; ~top: 0; list-style: none; padding: 0px; margin: 0px; bottom: 0px; left: 0px; } /*"поле" выбранного таба, bgcolor можно сделать прозр, чтобы таб (png) "наезжал" на картинку*/ ul#tabs { left: 0; z-index: 40; } ul#tabs li { font-size: 12px; font-family: Verdana; float: left; margin: 10px; } /*Мелкие иконки на табах*/ ul#tabs li img { padding: 0px; border: none; margin: 0px; } /*области со ссылками*/ ul#tabs li a { height: 24px; outline: none; background: #555/* url('../images/jq/click_bkg.png') no-repeat top left*/; } ul#tabs li a:hover { outline: 1px solid #666; /* Параметры рамки */ } ul#tabs li a.current { background: #fff /*url('../images/jq/click_bkg_active.png') no-repeat top left*/; } ul#tabs li a.current:hover { outline: none; /* Параметры рамки */ } /*активный таб при наведении говорит, что он не ссылка*/ ul#tabs li a.current:hover { text-decoration: none; cursor: default; } /*А вот это область нашей картинки*/ ul#output { right: 0; width: 780px; height: 439px; position: relative; } ul#output li { position: absolute; width: 780px; height: 439px; } /*Кнопка "узнать больше"*/ ul#output li a { position: absolute; bottom: 15px; right: 15px; padding: 8px 12px; text-decoration: none; font-size: 11px; color: #FFF; background: #000; -moz-border-radius: 5px; } ul#output li a:hover { background: #fff; color: #000; } Буду очень признателен за помощь..