Вопрос/ответ по дизайну css #5

Сообщений 61 страница 70 из 1000

Поделиться6124.06.12 10:03

Автор: Арина Пестрова
Призрак
Последний визит:
29.08.13 08:00
Уважение: +219

такое вот дело: на гл. странице я "убрала" колонки с кол-вом тем и сообщений, но теперь мне хотелось бы понять как можно текст в колонке последних сообщений выравнить по правой стороне. там, где ссылки на форумы и описание сделать определённую ширину, а иконки тем (они у меня справа) расположить между упомянутыми ранее двумя колонами
вот как выглядит сейчас:

Подпись автора

Поделиться6224.06.12 11:26

Автор: параноик
Призрак
Последний визит:
29.08.12 23:11
Уважение: +5

Мой вопрос решен.

Поделиться6324.06.12 15:10

Автор: Jane Volturi
Призрак
Последний визит:
18.12.15 11:57
Уважение: +12

Поднимаю вопрос!
Вопрос/ответ по дизайну css #5

Поделиться6424.06.12 17:30

Автор: Eri
Призрак
Последний визит:
17.08.14 02:18
Уважение: +619

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

Автор: Jane Volturi
Призрак
Последний визит:
18.12.15 11:57
Уважение: +12

Eri
Огромное спасибо! Теперь всё хорошо!)

Поделиться6626.06.12 16:15

Автор: параноик
Призрак
Последний визит:
29.08.12 23:11
Уважение: +5

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,'&lt;span class="visible">$1&lt;/span>&lt;span class="hide">$2&lt;/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

Автор: параноик
Призрак
Последний визит:
29.08.12 23:11
Уважение: +5

Еще возник вопрос, можно ли настроить скрипт так что бы ячейка открывалась и закрывалась при клике?

Поделиться6827.06.12 12:59

Автор: Jane Volturi
Призрак
Последний визит:
18.12.15 11:57
Уважение: +12

Почему не отображается вот этот копирайт внизу?

Код:

#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

Автор: sadhaka
Призрак
Последний визит:
12.04.15 16:29
Уважение: +874

Jane Volturi написал(а):

#pun {background-image: url(http://savepic.net/3001022.jpg)};

Вот это двоеточие в конце уберите, оно должно быть до }, а не после.

Поделиться7027.06.12 14:30

Автор: Jane Volturi
Призрак
Последний визит:
18.12.15 11:57
Уважение: +12

sadhaka написал(а):

Вот это двоеточие в конце уберите, оно должно быть до }, а не после.

Теперь фон форума идёт до самого низа, но копирайта всё ещё не видно.
Может можно разместить его как-то в пределах ширины форума, не используя вот это:

Jane Volturi написал(а):

#pun_wrap {
background-image: url("http://savepic.net/2991793.jpg");
background-repeat: no-repeat;
background-position: center bottom;
}

ForumD.ru - Дизайн, графика, скрипты, техническая поддержка для форумов и сайтов

Меню навигации

Пользовательские ссылки

Объявление

🎧 Подкаст «НЕТЕРОЛЕВЫЕ»

🍁 Что такое осень? Конкурс осенних дизайнов!

🔥 Акция! Осенние скидки на Мгновенные уведомления

❤️ Поддержи проект! Стань модератором!

💌 Акция! Подписка, лайк, коммент, репост!

🌟 SPECIAL OFFER: We distribute designs for free

❤️ Support the project

Информация о пользователе

Вопрос/ответ по дизайну css #5

Сообщений 61 страница 70 из 1000

Поделиться6124.06.12 10:03

Поделиться6224.06.12 11:26

Поделиться6324.06.12 15:10

Поделиться6424.06.12 17:30

Поделиться6524.06.12 17:45

Поделиться6626.06.12 16:15

Поделиться6726.06.12 17:19

Поделиться6827.06.12 12:59

Поделиться6927.06.12 13:24

Поделиться7027.06.12 14:30