GeorgGood
-
Posts
5 -
Joined
-
Last visited
GeorgGood's Achievements
Explorer (1/14)
0
Reputation
-
Помогите с padding. мне нужно чтобы межды пунктирной линией был отступ как на картинке но получается так: к отступу еще добавляется какое то расстояние, не могу в коде найти какое. FireBug его не показывает. Вот коды участка: <div id="news"> <div class="new"> <div class="title"> <p>New 1</p> </div> <div class="new_cont"> <p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis blandit, metus et mollis dictum, augue nisl feugiat dui, sed molestie elit nisi nec massa. Nulla ligula elit, porttitor eget commodo vel, bibendum ut ligula. Sed sit amet ultrices sapien. Aenean mattis dictum commodo. Etiam vel odio dui. Vivamus in nibh ligula. Etiam lacinia vehicula diam at mattis. Quisque scelerisque, tellus. </p> </div> <div class="date"> <p>2 Feb 2013 | 13:54</p> </div> </div> </div> CSS: #news { background: #DDDDDD; border-top-left-radius: 10px; border-top-right-radius: 10px; border-bottom-right-radius: 10px; border-bottom-left-radius:10px; padding: 20px 20px; box-shadow: 1px 1.732px 6px 0px #000; left: 102px; top: 150px; width: 565px; height: 300px; overflow: scroll; } .new { border: 1px dashed #898989; padding: 5px; margin: 5px; } .title p { font-size: 15px; color: #909090; } .new_cont { padding-left: 10px; } .new_cont p { font-size: 10px; color: #515151; font-style: italic; } И что еще нужно прописать, чтобы текст уходил не прямо перед границей блока, а чтобы отступ тоже был? Спасибо заранее! З.Ы. Не разобрался как тут вставлять картинки, так что без них)))
-
У тебя класс .current прописан для первого пункта меню, и он не подтягивается для других пунктов. Нужно добавить скрипт, который будет дописывать класс .current для активного пункта меню. а какой скрипт? Я новичок
-
Покажи еще html код. вот код. но не знаю этот ли он. потому что я с шаблоном работаю <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>[TITLE]</title> <?$META_DESCRIPTION$?> <link href="[CSS_URL]" rel="stylesheet" type="text/css" /> </head> <body> <div id="templatemo_wrapper"> <!-- <header> --> <div id="templatemo_header"> <div id="header_left"> <div id="site_title"> <a href="/" ><img src="/images/templatemo_logo.png" /><span>Картинки на заказ</span></a> </div> </div> <div id="header_right"> <ul id="social_box"> <li><a href="/news/rss"><img src="/images/rss.png" alt="RSS" /></a></li> </ul> </div> <div class="cleaner"></div> </div> <div id="templatemo_menu"> <ul> <li><a href="/" class="current">Главная</a></li> <li><a href="/index/0-2">О нас</a></li> <li><a href="/">Сервисы</a></li> <li><a href="/">Галлерея</a></li> <li class="last"><a href="/">Контакты</a></li> </ul> </div> <!-- </header> --> <div id="content_wrapper"> <!-- <middle> --> <div id="content"> [BODY] <div class="cleaner_h30"></div> </div> <div id="sidebar_wrapper"> <div id="sidebar_top"></div> <div id="sidebar"> <!-- <container> --> <!-- <block> --> <h2>TITLE</h2> CONTENT <br> <!-- </block> --> <!-- </container> --> </div> <div id="sidebar_bottom"></div> </div> <div class="cleaner"></div> <!-- </middle> --> </div> <!-- <footer> --> <div> Дизайн от <a href="http://www.templatemo.com" >CSS Templates</a>. $POWERED_BY$. </div> <div style="display: none;">Адаптация от <a href="http://utemplate.ru">uTemplates</a></div> <!-- </footer> --> </div> </body> </html> <!-- <popup> --> <table border="0" cellpadding="5" cellspacing="1" style="background:#ACACAC;" width="100%"> <tr><td style="background:url('/.s/t/947/3.gif') #40A3CF;color:#FFFFFF;" align="center"><b>[TITLE]</b></td></tr> <tr><td align="center" style="background:#FFFFFF;padding:5px;">[BODY]</td></tr> </table> <!-- </popup> --> не знаю как сделать спойлер
-
как это исправить? вот целый код. можете посмотреть, если конечно не сложно и если это поможет body { margin: 0px; padding: 0px; color: #CCCCCC; font-family: Helevetica,Arial,sans-serif; font-size: 13px; line-height:1.5em; background-color: #a79f4f; background-image: url(/images/templatemo_body.jpg); background-repeat: no-repeat; background-position: top center; } a, a:link, a:visited { color: #FFFFFF; } a:hover { color: #99FF00; text-decoration: none; } p { margin: 0px; padding: 0 0 10px 0; } img { border: none; } h1 { font-size: 40px; font-weight: bold; margin: 0 0 30px 0; padding: 5px 0; color: #fbe724; } h2 { font-size: 28px; font-weight: normal; line-height: 28px; margin: 0 0 20px 0; padding: 0; color: #fbe724; } h3 { font-size: 21px; margin: 0 0 10px 0; padding: 0; padding: 0; font-weight: normal; } h4 { font-size: 18px; margin: 0 0 20px 0; padding: 0; color: #fff;} h5 { font-size: 16px; margin: 0 0 10px 0; padding: 0; color:#fff; } h6 { font-size: 14px; margin: 0 0 5px 0; padding: 0; color:#fff;} .cleaner { clear: both; width: 100%; height: 0px; font-size: 0px; } .cleaner_h10 { clear: both; width:100%; height: 10px; } .cleaner_h20 { clear: both; width:100%; height: 20px; } .cleaner_h30 { clear: both; width:100%; height: 30px; } .cleaner_h40 { clear: both; width:100%; height: 40px; } .cleaner_h50 { clear: both; width:100%; height: 50px; } .cleaner_h60 { clear: both; width:100%; height: 60px; } .float_l { float: left; } .float_r { float: right; } .image_wrapper { display: inline-block; padding: 8px; border: 1px solid #999; background: #ffffff; margin-bottom: 10px; } .fl_img { float: left; margin: 3px 30px 15px 0; } .fr_img { float: right; margin: 3px 0 15px 15px; } blockquote { font-style: italic; margin-left: 10px;} cite { font-weight: bold; color:#fff; } cite span { color: #ccc; } em { color: #39ddfa; } .templatemo_list { margin: 20px 0; padding: 0; list-style: none; } .templatemo_list li { background: transparent url(/images/templatemo_list.png) no-repeat scroll 0 0px; margin:0 0 20px; padding:0 0 0 25px; line-height: 1em; } .button a { clear: both; display: block; width: 102px; height: 27px; padding: 5px 0 0 0; background: url(/images/templatemo_button.png) no-repeat; color: #333; font-weight: bold; text-align: center; text-decoration: none; } .button a:hover { color: #000; background: url(/images/templatemo_button_hover.png) no-repeat; } #templatemo_wrapper { width: 970px; margin: 0 auto; background: url(/images/templatemo_wrapper.png) repeat-y; } /* header */ #templatemo_header { width: 950px; height: 90px; margin: 0 10px; background: url(/images/templatemo_header.png) repeat-y; } #templatemo_header #header_left { float: left; width: 300px; } #templatemo_header #header_right { float: right; width: 500px; margin-right: 30px; } #templatemo_header #site_title { width: 250px; padding: 20px 0 0 20px; } #templatemo_header #site_title a{ margin: 0px; padding: 0px; font-size: 30px; color: #ffffff; font-weight: normal; text-decoration: none; } #templatemo_header #site_title a span { display: block; text-align: left; font-size: 14px; color: #333; font-weight: normal; margin-left: 5px; } #social_box { float: right; display: inline-block; margin: 20px 0 0; padding: 0; list-style: none; } #social_box li { display: block; float: left; padding: 0; margin: 0; } #social_box li a { width: 46px; height: 46px; margin-right: 5px; } /* end of header */ /* social */ #social_box { float: right; display: inline-block; margin: 20px 0 0; padding: 0; list-style: none; } #social_box li { display: block; float: left; padding: 0; margin: 0; } #social_box li a { width: 46px; height: 46px; margin-right: 5px; } /* end of social */ /* menu */ #templatemo_menu { clear: both; width: 970px; height: 72px; background: url(/images/templatemo_menu.png) no-repeat; } #templatemo_menu ul { margin: 0; padding: 0; list-style: none; } #templatemo_menu li { padding: 0px; margin: 0px; display: inline-block; background: url(/images/templatemo_menu_divider.png) right top no-repeat; } #templatemo_menu ul li a { float: left; display: block; height: 46px; width: 120px; padding-top: 14px; font-size: 14px; color: #000000; text-align: center; text-decoration: none; font-weight: bold; outline: none; border: none; } #templatemo_menu ul li a:hover, #templatemo_menu ul li .current { color: #FFFFFF; background: url(/images/templatemo_menu_hover.png) center bottom no-repeat; } #templatemo_menu ul .last { background: none; } /* end of menu */ #content_wrapper { clear: both; margin: 0 10px; padding-top: 20px; background: url(/images/templatemo_content.png) repeat-y; } #content_wo_sb { clear: both; padding: 30px; } #content { float: left; width: 550px; padding: 0 30px 30px; } #content p { text-align: justify; } #sidebar_wrapper { float: right; width: 280px; margin: 0 30px; } #sidebar_top { width: 280px; height: 10px; background: url(/images/templatemo_sidebar_top.png) no-repeat; } #sidebar_bottom { width: 280px; height: 10px; background: url(/images/templatemo_sidebar_bottom.png) no-repeat; } #sidebar { padding: 20px 30px; background: url(/images/templatemo_sidebar.png) repeat-y; } .col_w260 { width: 260px; } .news_box { margin-bottom: 30px; padding-bottom: 30px; background: url(/images/horizontal_div.png) repeat-x bottom; } .news_box h2 { margin-bottom: 5px; } .news_box .news_info { margin-bottom: 20px; } .sidebar_box { padding-left: 30px; } .sb_news_box { margin-bottom: 20px; padding: 10px 0 20px 0; border-bottom: 1px solid #343320; } .sb_news_box img { float: left; width: 60px; height: 60px; border: 1px solid #FFF; padding: 2px; } .sb_news_box .nb_right { float: right; width: 140px; margin-bottom: 0; padding-bottom: 0; } .sb_news_box .nb_right a { text-decoration: none; } .sb_news_box .nb_right a:hover { text-decoration: underline; } .sb_news_box .nb_right a h6 { color: #172a37; text-decoration: underline; } .service_box { width: 380px; margin-right: 40px; margin-bottom: 40px; } .service_box img { float: left; width: 48px; height: 48px; } .service_box .sb_right { float: right; width: 300px; } #gallery_home { clear: both; margin-top: 30px; } #gallery_home ul { list-style: none; margin: 0 0 30px 0; padding: 0; } #gallery_home ul li { float: left; display: block; padding: 0; margin: 0 20px 0 0; width: 160px; border: 5px solid #252414; } #gallery_home ul li img { width: 160px; height: 100px; } #gallery_home ul .last { margin: 0; } /* gallery */ #gallery { clear: both; margin-top: 30px; } #gallery ul { list-style: none; margin: 0; padding: 0; } #gallery ul li { float: left; display: block; padding: 0; margin: 0; width: 245px; margin: 0 35px 35px 0; } #gallery ul li h5 { margin-bottom: 15px; } #gallery ul img { width: 235px; height: 120px; border: 5px solid #1f1e12; margin-bottom: 10px; } #gallery ul .more { color: #FF0; text-decoration: none; } #gallery ul .more span { font-size: 16px; } /* end of gallery */ #contact_form { float: left; padding: 0; } #contact_form form { margin: 0px; padding: 0px; } #contact_form form .input_field { width: 350px; padding: 5px 0; background: #494730; border: 1px solid #17160d; } #contact_form form label { display: block; width: 100px; margin-right: 10px; font-size: 14px; color: #fff; } #contact_form form textarea { width: 350px; height: 200px; background: #494730; border: 1px solid #17160d; } #contact_form form .submit_btn { width: 102px; height: 32px; padding: 1px 0 5px 0; border: none; color: #333; cursor: pointer; background: url(/images/templatemo_button.png) no-repeat; } #contact_form form .submit_btn:hover { color: #000; background: url(/images/templatemo_button_hover.png) no-repeat; } /* footer */ #templatemo_footer { width: 890px; margin: 0 10px; padding: 30px; background: #0d869c url(/images/templatemo_footer.png) top repeat-x; } #templatemo_footer .footer_box { float: left; width: 260px; padding-right: 45px; } #templatemo_footer ul { padding: 0; margin: 0; list-style: none; } #templatemo_footer li { padding: 0; margin: 0 0 5px 0; } #templatemo_footer li a { display: block; color: #ccc; text-decoration: none; border-bottom: 1px dotted #fff; } #templatemo_footer li a:hover { color: #fff; } #templatemo_footer .last { padding-right: 0; } /* end of footer */ /* copyright */ #templatemo_copyright { width: 890px; margin: 0 10px; padding: 10px 30px; text-align: center; background: #0c4650 url(/images/templatemo_copyright.png) top repeat-x; } /* end of footer */
-
Смотрите, на картинке есть обведенный в красный кружок треугольник. При наводе мышкой на пункт меню он отображается, и , как правило он должен оставаться на около страницы пункта меню, которая открыта. например, если я нажму "О нас" то с "Главная" этот треугольник перейдет на "о нас". Но он не переходит, а остается на "главной", когда открыты другие страницы. Что нужно дописать в коде чтобы на странице "О нас" треугольник не был на "Главной", а был на "О нас" чтобы было понятно на какой странице посетитель сайта находится, и чтобы Пункт меню был таким же белым цветом, как "Главная"? А то не понятно перешел ты на страницу "О нас" или нет. Вот этот код: