Jump to content

Unger

Newbie
  • Posts

    9
  • Joined

  • Last visited

Everything posted by Unger

  1. Unger

    Верстка

    Я вот попробовал убрать у .menu #bl_1 a:hover{ margin-top:0px; и margin-left:0px; теперь текст на месте но hover подсвечивает не по фону
  2. Unger

    Верстка

    Не не катит, просто смещается images/bl_1_hover а текст так и прыгает
  3. Unger

    Верстка

    Скорей всего, они все три прыгают .menu #bl_1 a:hover{, .menu #bl_2 a:hover{, .menu #bl_3 a:hover{ #bl_1{ ... margin-top:5px; ... } (это зделан фон ссылки) а .menu #bl_1 a:hover{ я хотел зделать ка подсветка а оно почему то тянет текст туда куда не надо.
  4. Unger

    Верстка

    Очень интересно! В мозиле версии 3.5.17, опера 10 Может дадите адрес ящика я скину архивом со всеми картинками будет наглядней?
  5. Unger

    Верстка

    Пожалуйста. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta name="description" content="<?=$page_keywords?>"> <meta name="keywords" content="<?=$page_description?>"> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251"> <title><?=$page_title?></title> <link rel="stylesheet" type="text/css" href="css/style.css"> <link rel="stylesheet" type="text/css" href="css/main.css"> </head> <body> <div align="center"> <div id="border"> <div id="white"> <div id="menu"> <!-- левое меню --> <div class="one"> <div class="item"><a href="#">о нас</a></div> <div class="item"><a href="#">услуги</a></div> <div class="item"><a href="#">предложения</a></div> <div class="item"><a href="#">каталог продукции</a></div> <div class="item"><a href="#">портфолио</a></div> <div class="item"><a href="#">контакты</a></div> </div> <!-- правое меню --> <div class="two"> <a href="#">главная</a> <span>|</span> <a href="#">карта сайта</a> <span>|</span> <a href="#">e-mail</a> </div> </div><!--/end of #menu--> <!-- шапка --> <div id="shapka"> <div id="shapka2"> <div id="shapka3"> <div id="shapka_cen"></div> <div id="elit">Элитные отделочные материалы</div> <!--/end of #text--> </div> <!--/end of #shapka3--> </div><!--/end of #shapka2--> </div><!--/end of #shapka--> <!-- начало теблицы контента --> <table cellpadding="0" cellspacing="0"> <tr> <td class="left"> <div id="left"> <!-- новости компании --> <div class="top"></div> <div class="filtr"> <div id="fil">фильтр</div> <div class="for"> <select name="selekt" style="width:184px; margin-left:5px; margin-top:10px; background-color: #CCCCCC;"> <option>Наименование</option> </select> <div id="fil_2">разделы каталога</div> <div class="menu" > <div id="bl_1"><a href class="tek"="#">Наименование</a></div> <div id="bl_2"><a href class="tek"="#">Мозаика</a></div> <div id="bl_3"><a href class="tek"="#">Материалы</a></div> <div class="menu_2"> <div id="bl_1_1"><a href class="tek_2"="#">Способы укладки</a></div> <div id="bl_1_1"><a href class="tek_2"="#">Техника</a></div> <div id="bl_1_1"><a href class="tek_2"="#">Укладка мозаики на сетку</a></div> <div id="bl_1_3"><a href class="tek"="#">наименование</a> </div> </div> </div> </div> </div> <div class="news"> <div id="fil">новости компании</div> <div class="date">02.02.07 ::</div> <div class="text">Самая полная и самая разнообразная информация о Вашей компании.</div> <a href="#" class="podrobnee"><img src="images/dot_01.gif" alt="" border=0>подробнее</a> <div class="date">25.01.07 ::</div> <div class="text">Самая полная и самая разнообразная информация о Вашей компании.</div> <a href="#" class="podrobnee"><img src="images/dot_01.gif" alt="" border=0>подробнее</a> </div> <div class="bottom"></div> <!--/end of .news--> <!-- cпецпредложение --> <!--/end of .corner--> <!--/end of .offer--> </div><!--/end of #left--> </td> <td id="right"> <div class="obzor">обзор услуг</div> <p> <div class="tekst">Компания ПО "Л&К компани" специализируется на поставках и работах с широким спектром высококачественных зарубежных, комплектующих, метериалов и оборудования. Основная сфера деятельности сервисное обслуживание конвейерного и промышленного оборудования.Изготовление промышленных резинотехнических изделий. Поставка специальных клеёв, составов и материалов для стыковки и ремонта конвейерных лент. Подготовки персонала технологиям стыковки и сервисного обслуживания конвейерных лент методами холодной и горячей вулканизации. Проведение геологоразведочных работ, исследование береговых прибережных и морских грунтов в портах и при строительстве морских сооружений. Исследование дамб и береговых укреплений без их разрушения. Подготовка материалов для строительного надзора. Рекомендации по охране окружающей среды. Управление и контроль строительством.<p> Компания ПО "Л&К компани" специализируется на поставках и работах с широким спектром высококачественных зарубежных, комплектующих, метериалов и оборудования. Основная сфера деятельности сервисное обслуживание конвейерного и промышленного оборудования.Изготовление промышленных резинотехнических изделий. Поставка специальных клеёв, составов и материалов для стыковки и ремонта конвейерных лент. Подготовки персонала технологиям стыковки и сервисного обслуживания конвейерных лент методами холодной и горячей вулканизации. Проведение геологоразведочных работ, исследование береговых прибережных и морских грунтов в портах и при строительстве морских сооружений. Исследование дамб и береговых укреплений без их разрушения. Подготовка материалов для строительного надзора. Рекомендации по охране окружающей среды. Управление и контроль строительством.</p></div> <!--/end of .content_01_bg_01--> <!-- почему мы --> <!--/end of #why--> <!-- обзор услуг --> <!--/end of #services--> <!--/end of #services--> <br class="clearer"> <div class="copyright">Copyright © 2007 БизнесНовости.Ру. Все права защищены.</div></td></tr></table> </tr> </table> <!--конец таблицы контента--> </div><!--/end of #white--> </div><!--/end of #border--> </div> </body> </html> CSS body { width:980px; background-color: #000000; padding-left:10%; padding-top:10%; } .main{ width:764px; margin:auto; } table { width: 100%; } td { vertical-align: top; } #border { background-color:#A49F8C; border:2px solid #7C7455; padding:4px; } #white { background-color: #000000; padding:10px 7px; text-align:left; } *html #white, *html #border { width: 100%; } *html #menu { height: 53px; } #menu { background-image:url('../images/menu_bg.gif'); height:48px; } #menu .one { float: left; } #menu img { margin: 0 20px; } #menu .one .item { background-image:url('../images/separator.gif'); background-position:right; background-repeat:no-repeat; float:left; height:34px; padding:20px 20px 0 22px; } *html #menu .one .item, *html #menu .two { height: 42px; } #menu .two { float:right; height:28px; padding:14px 7px 0; } #menu .two span { padding: 0 5px; } #shapka, #shapka2, #shapka3 { height:153px; } #shapka { background-image:url('../images/shapka_bg.gif'); border-bottom:1px solid #ffca00; } #shapka2, #shapka3, #left, #left .offer .corner { background-repeat:no-repeat; } #shapka2 { background-image:url('../images/shapka_bg_01.jpg'); background-position:left; } #shapka3 { background-image:url('../images/shapka_bg_02.jpg'); background-position:right; } #shapka_cen{ background-image:url('../images/shapka_bg_cen1.gif'); position: absolute; width:233px; height:134px; margin-left:370px; margin-top:9px; } #text { float:right; padding:45px 120px 0 0; text-align:left; } #text .slogan { position: relative; top: -8px; } .text{ margin-left:5px; margin-right:10px; } .tekst{ color:#FFFFFF; margin-left:20px; margin-right:30px; font-size:11px; font-family:Arial, Helvetica, sans-serif; } td.left, #left { width: 206px; } .filtr{ background:url('../images/news_bg1.gif'); background-repeat:repeat-y; } #fil{ font-family: Arial; font-size:18px; color:#ffca00; margin-left:5px; font-variant:small-caps; font-weight:600; } .obzor{ font-family: Arial; font-size:18px; font-variant: small-caps; font-weight: 600; color:#ffca00; margin-left:20px; margin-top:10px; } #fil_2{ font-family: Arial; font-size:18px; color:#ffca00; margin-left:5px; margin-top:4px; font-variant:small-caps; font-weight:600; } #bl_1{ background:url('../images/bl_1.GIF') repeat-x; width:197px; margin-top:5px; margin-left:1px; height:31px; color:#FFFFFF; } #bl_2{ background:url('../images/bl_1.GIF') repeat-x; margin-top:1px; width:197px; margin-left:1px; height:31px; color:#FFFFFF; } #bl_3{ background:url('../images/bl_1.GIF') repeat-x; margin-top:1px; width:197px; margin-left:1px; height:31px; color:#FFFFFF; } /*начало подсветка/ ——————*/ .menu #bl_1 a:hover{ background:url('../images/bl_1_hover.GIF'); margin-top:1px; width:197px; margin-left:0px; height:30px; color:#FFFFFF; } .menu #bl_2 a:hover{ background:url('../images/bl_1_hover.GIF'); margin-top:0px; width:197px; margin-left:0px; height:31px; color:#FFFFFF; } .menu #bl_3 a:hover{ background:url('../images/bl_1_hover.GIF'); margin-top:1px; width:197px; margin-left:0px; height:30px; color:#FFFFFF; } /* конец подсветка/ ——————*/ #bl_1_1{ background:url('../images/bl_1_1.gif') repeat-x; margin-top:1px; width:197px; margin-left:1px; height:21px; color:#FFFFFF; } #bl_1_3{ background:url('../images/bl_1.GIF') repeat-x; width:197px; margin-top:2px; margin-left:1px; height:31px; color:#FFFFFF; } .menu_2 a:hover{ color:#ffca00; } .menu_2 #bl_1_3 a:hover{ color:#FFFFFF;} .top{ background:url('../images/news_bg_top.gif'); margin-top:10px; background-repeat:no-repeat; height:2px; } .bottom{ background:url('../images/news_bg_bottom.gif'); background-repeat:no-repeat; height:3px; margin-bottom:5px; width:199px; } .tek{ position: absolute; margin-top:5px; font-size: 12px; text-decoration:none; margin-left:5px; font-weight:bold; } .tek_2{ position:absolute; margin-top:2px; font-size:11px; text-decoration:none; margin-left:5px; font-weight: 300; } #elit{ position:relative; padding-top:132px; color:#FFFFFF; font-size:14px; margin-left:5px; font-weight:900 } #left .news { background-color:#DFD7B8; background-image:url('../images/news_bg1.gif'); background-position: bottom; background-repeat:repeat-y; padding:15px 8px 19px 0px; width:191px; } #left .news .date { padding: 15px 0 0 15px; } #left .news .podrobnee { color:#ffca00; float: right; } #left .news .podrobnee img, .services .podrobnee2 img { margin-right: 3px; position: relative; top: -1px; } #left .offer { background-image:url('../images/offer_bg.gif'); background-position:right bottom; border-right:1px solid #C2B999; float:left; width:198px; } #left .offer .corner { background-image:url('../images/offer_corner.gif'); background-position:right bottom; padding:6px 16px 15px 14px; width:168px; } #left .offer .image, #left .offer .text { float: left; padding-top: 6px; } #left .offer .text { padding-left:16px; width:104px; } *html #left .offer .text { width: 120px; } #right .content_01_bg_02 { background-image:url('../images/content_01_bg_02.jpg'); background-repeat:no-repeat; height:217px; } .content_01_bg_01 { background-image:url('../images/content_01_bg_01.gif'); background-position:left bottom; background-repeat:repeat-x; height:217px; } .time { padding: 4% 20px 0 163px; } .time p { margin: 0; } .time p.text { padding-top: 26px; } .links01,.links02 { float:left; padding:13px 0; width:144px; } .clearer { clear: both; } .links01 a img,.links02 a img, .square{ margin:-2px 4px 0px 12px; } .links03 a img,.dot { margin: 0 5px 0 12px; } .links03{ height:15px; } .links03 div{ height:15px; float:left; } .dot2 { margin: 0 5px 0 0px; } .links03 { background-color:#F0F1EF; height:15px; text-align:center; } .services { margin-bottom:10px; margin-right:200px; } .services .title { padding-left:17px; padding-top:17px; } .services .image { float:left; height:68px; text-align:center; width:93px; } .services .podrobnee2 { float: right; } .services .text { height:70px; margin-left:93px; } .services .pod { height:15px; margin-left:93px; } .sep { height: 15px; } #why { float:right; padding:20px 18px; width:164px; } *html #why { width: 200px; } #why .shadow { background-image:url('../images/left_shadow.gif'); background-position:right bottom; background-repeat:no-repeat; width:171px; } #why .shadow .text { background-color:#D8D0B1; background-image:url('../images/why_corner.jpg'); background-position:right bottom; background-repeat:no-repeat; border-top:7px solid #A49F8C; width:164px; } #why .shadow .text .title { background-image:url('../images/offer_bg.gif'); height:24px; padding:8px 0 0; text-align:center; } *html #why .shadow .text .title { height: 32px; } #why .shadow .text .image { padding:7px 0 0; text-align:center; } #why .shadow .text .words { padding: 7px 0 10px 12px; } #line { background-color:#A49F8C; height:7px; margin-top:17px; overflow:hidden; } .copyright { color:#7f7f7f; margin-left:250px; position: absolute; left: 130px; top: 805px; } #in_cont{ padding:10px 0px 0px 0px; } .pagetitle h1{ font-size:20px; color:#a49f8c; }
  6. Unger

    Верстка

    Спасибо но текст по прежнему смещается вверх а сам ховер на 5px вниз есть ещё варианты?
  7. Unger

    Верстка

    Привет всем!!! Народ подскажите пожалуйста как сделать что бы при наведении в ссылке текст не смещался в левый верхний угол? вот код: <div class="menu" > <div id="bl_1"><a href class="tek"="#">Наименование</a></div> <div id="bl_2"><a href class="tek"="#">Мозаика</a></div> <div id="bl_3"><a href class="tek"="#">Материалы</a> </div> CSS .tek{ position: absolute; margin-top:5px; font-size: 12px; text-decoration:none; margin-left:5px; font-weight:bold; } .menu #bl_1 a:hover{ background:url('../images/bl_1_hover.GIF'); margin-top:1px; width:197px; margin-left:0px; height:30px; color:#FFFFFF; position: fixed; } .menu #bl_2 a:hover{ background:url('../images/bl_1_hover.GIF'); margin-top:0px; width:197px; margin-left:0px; height:31px; color:#FFFFFF; } .menu #bl_3 a:hover{ background:url('../images/bl_1_hover.GIF'); margin-top:1px; width:197px; margin-left:0px; height:30px; color:#FFFFFF; }
  8. Unger

    Верстка

    Как сделать выпадающее меню?
  9. Unger

    Верстка

    Как сделать чтобы страничка отображалась в браузерах по средине ?
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy