такое вот дело: на гл. странице я "убрала" колонки с кол-вом тем и сообщений, но теперь мне хотелось бы понять как можно текст в колонке последних сообщений выравнить по правой стороне. там, где ссылки на форумы и описание сделать определённую ширину, а иконки тем (они у меня справа) расположить между упомянутыми ранее двумя колонами
вот как выглядит сейчас:
Вопрос/ответ по дизайну css #5
Сообщений 61 страница 70 из 1000
Поделиться6124.06.12 10:03
Поделиться6224.06.12 11:26
Мой вопрос решен.
Поделиться6324.06.12 15:10
Поднимаю вопрос!
Вопрос/ответ по дизайну css #5
Поделиться6424.06.12 17:30
Jane Volturi
попробуйте еще немного изменить в цветах-ксс:
.punbb .post-sig dt {
border-top-color: #fff !important;; border-style:solid !important;
}
на
.punbb .post-sig dt {border-top-color: #999999 !important;}
Арина Пестрова
в /* C2.3 */ прописываете text-align: left;
в /* C2.1 */ нужную ширину первой колонки width: 500px; например
Поделиться6524.06.12 17:45
Eri
Огромное спасибо! Теперь всё хорошо!)
Поделиться6626.06.12 16:15
http://hjfgfh.rusff.ru/
Извиняйте за глупый вопрос, но я с такой таблицей работаю первый раз.. как можно опустить немного выпадающую ячейку что бы она не наезжала на картинки в таблице?
Код:<div style="position: absolute; top: 325px; left: 665px; color:#1e1e14; width:255px; font-size:9px;"> <style type="text/css"> /*Спойлер */ .punbb .quote-box.spoiler-box{ border:#C6C6CF 1px solid; border-radius:5px; -webkit-border-radius:5px; -khtml-border-radius:5px; -moz-border-radius:5px; -o-border-radius:5px; box-shadow: 0px 2px 4px #8E8E8E; -webkit-box-shadow: 0px 2px 4px #8E8E8E; -khtml-box-shadow: 0px 2px 4px #8E8E8E; -moz-box-shadow: 0px 2px 4px #8E8E8E; } .post-content .spoiler-box > blockquote.visible { display: none;}.punbb .spoiler-box blockquote { min-width: 100%!important; } .post-content .spoiler-box span.hide{ display:none; } </style> <script> $(".post-box .quote-box.spoiler-box div[onclick*='toggleClass']").each(function() { $(this).html($(this).html().replace(/(.*)?\|(.*)?/img,'<span class="visible">$1</span><span class="hide">$2</span>')) }); $(".post-box .quote-box.spoiler-box div[onclick*='toggleClass']").click(function(){ $(this).next('blockquote').toggle('Slow'); $(this).find('span:eq(0),span:eq(1)').toggleClass('hide').toggleClass('visible'); }); }); </script> <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.js"></script> <script type="text/javascript" src="https://forumstatic.ru/files/0011/6d/4d/44458.js"></script> <script type="text/javascript" src="https://forumstatic.ru/files/0011/6d/4d/60211.js"></script> <script type="text/javascript" src="https://forumstatic.ru/files/0011/6d/4d/41587.js"></script> <script type="text/javascript"> $(function(){ $('#navigation_horiz').naviDropDown({ dropDownWidth: '300px' }); $('#navigation_vert').naviDropDown({ dropDownWidth: '300px', orientation: 'vertical' }); }); </script> <style type="text/css"> ----------------------------------------------------- */ /* navigation styles - BEGIN */ /* style for horizontal nav */ #navigation_horiz {width:820px; clear:both; padding:0 0 0 0; margin:0 auto} #navigation_horiz ul {height:50px; display:block} #navigation_horiz ul li {display:block; float:left; width:100px; height:50px; background:#; margin:0 1px 0 0; position:relative} #navigation_horiz ul li a.navlink {display:block; width:100px; height:30px; padding: 20px 0 0 0; text-align:center; color:#e2dfe3; text-decoration:none} #navigation_horiz .dropdown {position:absolute; padding:20px; border-bottom-right-radius:10px; border-bottom-left-radius:10px; -moz-border-radius-bottomright:10px; -moz-border-radius-bottomleft:10px} /* style for vertical nav */ #navigation_vert {width:820px; clear:both; padding:0 0 0 0; margin:0 auto} #navigation_vert ul {height:50px; display:block} #navigation_vert ul li {display:block; width:200px; height:50px; background:#999; margin:0 0 1px 0; position:relative} #navigation_vert ul li a.navlink {display:block; *display:inline-block; width:200px; height:30px; padding: 20px 0 0 0; text-align:center; color:#fff; text-decoration:none} #navigation_vert .dropdown {position:absolute; padding:20px; border-bottom-right-radius:10px; border-top-right-radius:10px; -moz-border-radius-bottomright:10px; -moz-border-radius-topright:10px} /* style for each drop down - horizontal */ #navigation_horiz ul li #dropdown_one {background:#ddddda; color:#fff} #navigation_horiz ul li #dropdown_one a {color:red} #navigation_horiz ul li #dropdown_two {background:#ddddda; color:#fff} #navigation_horiz ul li #dropdown_two a {color:black} #navigation_horiz ul li #dropdown_three {background:#ddddda; color:#fff} #navigation_horiz ul li #dropdown_three a {color:gray} /* style for each drop down - vertical */ #navigation_vert ul li #dropdown_four {background:#333; color:#fff} #navigation_vert ul li #dropdown_four a {color:red} #navigation_vert ul li #dropdown_five {background:#666; color:#fff} #navigation_vert ul li #dropdown_five a {color:black} #navigation_vert ul li #dropdown_six {background:#777; color:#fff} #navigation_vert ul li #dropdown_six a {color:orange} /* navigation styles - END */ /* ----------------------------------------------------- */ </style> <div style="position: absolute; top: -325px; left: -378px; color:#fff; width:310px;"> <div id="navigation_horiz"> <ul> <li> <a href="" class="navlink"><img src="http://s1.uploads.ru/i/3/J/s/3JsjK.png" border="0" /></a> <div class="dropdown" id="dropdown_one" style="width: 300px; left: 0px; top: 50px; display: none"> <p> 1 ячейка<br> 1 ячейка<br> 1 ячейка<br> 1 ячейка<br> 1 ячейка<br> 1 ячейка<br> 1 ячейка<br> 1 ячейка<br> 1 ячейка<br> 1 ячейка<br> </p> </div> <!-- .dropdown_menu --> </li> <li> <a href="" class="navlink"><img src="http://s1.uploads.ru/i/j/k/R/jkRVA.png" border="0" /></a> <div class="dropdown" id="dropdown_two" style="width: 300px; left: 0px; top: 50px; display: none"> <p>2 ячейка</p> </div> <!-- .dropdown_menu --> </li> <li> <a href="" class="navlink"><img src="http://s1.uploads.ru/i/q/L/9/qL9xR.png" border="0" /></a> <div class="dropdown" id="dropdown_two" style="width: 300px; left: 0px; top: 50px; display: none"> <p>3 ячейка </p> </div> <!-- .dropdown_menu --> </ul> </div> </div>
Поделиться6726.06.12 17:19
Еще возник вопрос, можно ли настроить скрипт так что бы ячейка открывалась и закрывалась при клике?
Поделиться6827.06.12 12:59
Почему не отображается вот этот копирайт внизу?
#pun_wrap { background-image: url("http://savepic.net/2991793.jpg"); background-repeat: no-repeat; background-position: center bottom; }
Ссылка на форум: http://testovoi.rolbb.ru/
Код:/* CS1 Background and text colours -------------------------------------------------------------*/ body { background-image: url(http://savepic.net/2991807.jpg); background-color: #330000; background-position: top center; background-attachment: repeat; } #pun {background-image: url(http://savepic.net/3001022.jpg)}; #pun_wrap { background-image: url("http://savepic.net/2991793.jpg"); background-repeat: no-repeat; background-position: center bottom; } /* CS1.1 */ .punbb .section .container, .punbb .post-body, .punbb .post-links, .punbb td.tc2, .punbb td.tc3, .punbb .formal fieldset .post-box, #viewprofile li strong, #viewprofile li div, #setmods dd, .punbb .info-box, .punbb #pun-main .info-box .legend { color: #333; } /* CS1.2 */ .punbb .main .container, .punbb .post .container, .punbb .post h3, .punbb-admin #pun-admain .adcontainer { color: #333; background-color: transparent; } /* CS1.3 */ #pun-stats h2, .punbb .main h1, .punbb .main h2, #pun-debug h2, .punbb-admin #pun-admain h2 { text-align: center; background-image: url(http://savepic.net/2997939.jpg); background-repeat: no-repeat; background-position: center; height: 50px; color: #330000; font-size: 28px; font-weight: bold; font-family: DigifaceWide; } /* CS1.4 */ #pun-title, #pun-title .container{ background-image: url(http://savepic.net/2991806.jpg); color: #333; background-color: transparent; } /* CS1.5 */ .punbb legend span, #viewprofile h2 span, #profilenav h2 span, .punbb-admin #pun-admain legend span { color: #333; background-color: transparent; } /* CS1.6 */ .punbb .post h3 span, .punbb th, #viewprofile li, #setmods dl { color: #333; background-color: transparent; } /* CS1.7 */ .punbb .quote-box, .punbb .code-box { background-image: url(); color: #333 } /* CS1.8 */ #pun-navlinks .container { color: #333; background-color: transparent; } .offline li.pa-online strong { font-weight: normal } .punbb textarea, .punbb select, .punbb input { background-color: #cccccc; color: #333 } /* CS2 Border colours -------------------------------------------------------------*/ #pun {background-color: #ccc;} /* CS2.1 */ .punbb .container, .punbb .post-body, .post h3, #pun-title { border-color: #93928C #93928C #93928C #93928C; border-style:none !important; } /* CS2.2 */ .punbb .section, .punbb .forum, .punbb .formal, .punbb .modmenu, .punbb .info, .punbb .category, .punbb .post { border-color: #93928C; border-style:none !important; } /* CS2.3 */ #pun-stats h2, .punbb .main h1, .punbb .main h2, #pun-debug h2, .punbb-admin #pun-admain h2 { border-color: #93928C;; border-style:none !important; } /* CS2.4 */ .punbb td, .punbb fieldset, #viewprofile ul, #profilenav ul, .punbb .post .post-body, .punbb .post h3 span, .post-links ul, .post-links, .usertable table { border-color: #93928C;; border-style:none !important; } /* CS2.5 */ .punbb th { border-color: #93928C; border-style:none !important; } /* CS2.6 */ .punbb .quote-box, .punbb .code-box { border-color: #93928C #93928C #93928C #93928C; border-style:none !important; } #pun-ulinks li, #pun-announcement h2 span, li#onlinelist, #pun-help .formal .info-box h3.legend span { border-color: #93928C; border-style:none !important; } #pun-ulinks li a, #pun-announcement h2, li#onlinelist div, #pun-help .formal .info-box h3.legend { border-color: #93928C; border-style:none !important; } .punbb .divider { border-color: #4F4F4F #8F8F8F #8F8F8F #8F8F8F; border-style:none !important; } .punbb .formal fieldset .post-box, .punbb .info-box { border: 1px solid #dedfdf; border-style:none !important; } li.pa-online { border-left-color: #6F6F6F; border-style:none !important; } .punbb .post-sig dt {border-top-color: #999999 !important;}
Поделиться6927.06.12 13:24
#pun {background-image: url(http://savepic.net/3001022.jpg)};
Вот это двоеточие в конце уберите, оно должно быть до }, а не после.
Поделиться7027.06.12 14:30
Вот это двоеточие в конце уберите, оно должно быть до }, а не после.
Теперь фон форума идёт до самого низа, но копирайта всё ещё не видно.
Может можно разместить его как-то в пределах ширины форума, не используя вот это:
#pun_wrap {
background-image: url("http://savepic.net/2991793.jpg");
background-repeat: no-repeat;
background-position: center bottom;
}