Техническая поддержка сервиса Quadro.Boards

Объявление

Новости сервиса

О форуме

Quadro.Support – это форум технической поддержки различных проектов и сервисов Quadro.Systems LLC, на котором грамотные технические специалисты всегда смогут помочь вам в решении проблем, или же подсказать ответы на самые сложные вопросы. Так же на форуме собрана обширная база знаний по различным аспектам наших сервисов. Не забывайте пользоваться поиском ;)

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

Привет, Гость! Войдите или зарегистрируйтесь.


Вы здесь » Техническая поддержка сервиса Quadro.Boards » Оформление форумов » Вопросы по оформлению форума, дизайну и css (3)


Вопросы по оформлению форума, дизайну и css (3)

Сообщений 781 страница 800 из 1000

1

Как сделать? Что вставить? Где править?
Отвечаем на ваши вопросы по оформлению форумов. :mybb:

Прошлые темы:
1. Вопросы по оформлению форумов, дизайну и css
2. Вопросы по оформлению форумов, дизайну и css - 2

Теги: вопросы по оформлению, стиль форума, стиль, css, style, как сделать

0

781

И снова здравствуйте!

ссылка на форум, если надо

форум

Проблему выделила красным, не понимаю, что не так сделала, но вдруг перестало отображаться ссылкой и стало показываться вот так:

скрин

http://sb.uploads.ru/yBPzH.png

0

782

Zetsuu
используете скрипт скрытия названий: если да - это он косячит

0

783

sadhaka
да, используется такой скрипт

скрипт
Код:
<script type="text/javascript">
var A=[1,2,3]
$(".post .post-author li").each(function (){
for(var i in A){if($(this).hasClass("pa-fld"+A[i])){
$(this).html($(this).html().replace(/^[^:]*:/,''));}};});
</script> //*сокрытие названий полей профиля

0

784

дада, и опять я :confused:

Скрытый текст:

Для просмотра скрытого текста - войдите или зарегистрируйтесь.

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

Выставленные награды не отображаются под профилем в сообщении. Спойлер лишь содержит ссылку на все награды и "нет наград" пишет под профилем, где они должны быть. В общем списке наград значится, что этому профилю награда выдана, а под аватаром - не показывает((

собственно, проблема наблюдается у всех админов, даже знакомых проверить с разных браузеров просили - у всех только с мозиллы и открываются, да и там с заминкой по времени появляются сами награды. может что не так в css или скриптах? или еще что? ибо вчера еще в опере у меня открылись они - сегодня уже не видно наград.
пс. уже убирали скрипты из низа и верха на проверку - что-то не вышло выявить косяк оО

Отредактировано pons (13.05.2014 11:22:43)

0

785

summer
Огромное спасибо! И еще подскажите пожалуйста
Возникла проблема с обрамлением профиля, не получается подогнать, сверху каждый раз появляется расстояние, которое абсолютно не нужно.
http://i64.fastpic.ru/big/2014/0511/57/ … 765257.png
как можно исправить данную проблему?

Скрытый текст:

Для просмотра скрытого текста - войдите или зарегистрируйтесь.

Отредактировано 99problem (13.05.2014 21:51:14)

0

786

99problem
Убрать зачёркнутое и добавить выделенное:

.punbb .post .post-author > ul {
  background:url(http://i63.fastpic.ru/big/2014/0511/a8/ … 7407a8.png) 0 top no-repeat,url(http://i63.fastpic.ru/big/2014/0511/c8/ … ec74c8.png) 0 bottom no-repeat;
/*Ôîí âåðõà - íèçà*/
  margin: -5px 0 -32px 0!important;
  padding:52px 0px!important;
min-height: 300px;
}

0

787

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

проблема наблюдается у всех админов

только у админов?
из-под гостя на указанном форуме награды вижу в Хроме.

0

788

решено

sadhaka
Судя по всему, только от гостя и видно Оо
пользователям и админам - нет

upd. причина была все же в скрипте

Отредактировано pons (15.05.2014 05:49:27)

0

789

Доброго времени суток! Так уж вышло, что отношения с футерами у меня совершенно не складываются.
Помогите, будьте добры, подогнать несчастного под форум =_=

Код:
/* CS1.5 
#pun-about p.container {background-image: url(http://ipic.su/img/img7/fs/321.1400359531.jpg); background-position: top center; background-repeat: no-repeat; height: 223px; width: 920px;}
div#html-footer {margin: -150px 0px 0px 0px;}

Отредактировано albar (19.05.2014 18:25:19)

0

790

albar
этим заменить то, что вы выложили

Код:
#pun-about p.container {
  background-image: url("http://ipic.su/img/img7/fs/test.1400360240.png");
  background-position: center bottom;
  background-repeat: no-repeat;
  height: 223px;
  left: 50%;
  margin-left: -460px;
  padding: 0;
  position: absolute;
  width: 920px;
}

Пойдет так?)

+1

791

Ichimaru Gin
Воу, вы волшебник! Вроде как стало, как надо. Спасибо большое)

0

792

И снова доброе утро здравствуйте.
Теперь возник вопрос с...рамкой в профиле? В общем, заехала она туда, куда не надо. Как бы подвинуть? А еще границы верха и низа отображаются не совсем корректно. Буду благодарен за помощь в сим великом деле. Хочу сдвинуть эту шайтан-машину правее, чтобы основную рамку не загораживало. Такие дела. И пострадает ли при этом граница с полями вводимых сообщений, станет ли меньше? (могу выражаться не совсем понятно, пардон)
http://ipic.su/img/img7/fs/213.1400418325.jpg
На всякий случай прилагаю код, который используется:

Код

<style type="text/css">
        /*окантовка профиля - картинками*/
        .post-author a, .post-author a:hover, .post-author a:focus, .post-author a:active {color: #000 !important;
        }
        li.pa-avatar {margin-top: 2px !important; z-index: 5;}
        .pa-title {
        color: #000 !important;
        font-family: "Century" !important;
        font-size: 10pt !important;
        font-variant: small-caps !important;
        font-weight: 300 !important;
        padding: 0px 0px 5px 5px !important;
        text-align: center;
        }

        .pa-author {
        background: url("http://ipic.su/img/img7/fs/uppp.1400415046.jpg") 0% 0% no-repeat;
        color: #000 !important;
        height: 25px;
        line-height: 26px !important;
        margin-left: -0px !important;
        margin-top: -0px !important;
        padding: 0px 5px 0px 0px !important;
        position: relative;
        text-align: center;
        width: 200px !important;
        }
        .pa-author a, .pa-author {
        color: #000 !important;
        font-family: "Century" !important;
        font-size: 10pt !important;
        font-variant: small-caps !important;
        font-weight: 200 !important;
        margin-left: 0px;
        text-align: center;
        font-style: normal !important;
        }

        .post-author {
        background: url("http://ipic.su/img/img7/fs/ser.1400415115.jpg") repeat-y; weight: 200px;
        color: #000 !important;
        }
        .post-author ul li {
        padding: 0px 3px;
        text-align: center;
        color: #000 !important;
        }

        .post-author > ul {
            background: url("http://ipic.su/img/img7/fs/dd.1400415154.jpg") no-repeat scroll center bottom transparent;
        margin-left: 0px;
        text-align: center;
        width: 200px !important;
        margin-left: -11px !important;
        }
</style>

Отредактировано albar (19.05.2014 18:25:00)

0

793

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

Вроде как стало, как надо.

а у меня и в Хроме и в Мозилле сдвиг на 1 пиксель наблюдается почему-то(
поставьте так:

Код:
#pun-about p.container {
  background-image: url("http://ipic.su/img/img7/fs/test.1400360240.png");
  background-position: center bottom;
  background-repeat: no-repeat;
  height: 223px;
  left: 50%;
  margin-left: -461px;
  padding: 0;
  position: absolute;
  width: 920px;
}

Профиль на странице сообщений, ищите в стиле .punbb .post .post-author и заменяйте правило на вот это:

.punbb .post .post-author {
    float: left;
    margin-left: 4px;
    margin-top: -1.5em;
    overflow: hidden;
    width: 19em;
}


зеленое число - это сдвиг слева. Его можно увеличть до 12.


Если покажется, что отступ нужен больше, от 13 до 23,  то придется сделать еще одно изменение:

.punbb .post-body {
    border-left-style: solid;
    border-left-width: 1px;
    margin-left: 20em;
    padding: 0 0 1px;
}

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

. И пострадает ли при этом граница с полями вводимых сообщений, станет ли меньше?

не пострадает

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

А еще границы верха и низа отображаются не совсем корректно

не понял, о каких границах идет речь)

0

794

Ichimaru Gin, спасибо огромное)
С отображениями теперь все в полном порядке.

0

795

В очередной раз обращаюсь к вам за помощью.
Теперь дело стопорнулось за табличкой. Собственно, хотелось бы узнать, как этот столбец с кнопками перетащить так, чтобы он был на уровне с остальными двумя столбцами, на которых отображается информация после нажатия. Или, если, допустим, если кнопки в сумме по размеру были меньше, то пусть хотя бы по центру висят там (приблизительно по синим границам =_=).
Ну и второе, такое же важное:
Как убрать ту серенькую заливку, которая при клике на нужный элемент отображается? Сейчас она мне кажется лишней.
http://ipic.su/img/img7/fs/Bezimeni-12.1400527027.jpg
Код таблицы:

код
Код:
<style>
#pun-announcement .main {
	width: 100%;
	height: 250px;
}
.buttons {
	float: left;
	height: 250px;
	width: 30%;
}
.buttons ul {
	margin-top: 75px;
}
.buttons ul li {
	height: 50px;
	font-weight: bold;
	cursor: pointer;
	border: 0px solid black;
	margin: 4px;
}
.buttons ul li.active, .buttons ul li:hover {
	background-color: grey;
}

.content {
	height: 100%;
	margin-left: 31%
}
.content > div {
	text-align: center;
	display: none;
}

h3 {
	padding-top: 3px;
	height: 17px;
	
}

.in {
	display: inline-block;
	vertical-align: top;
	width: 45%;
}
.scroll {
	height: 230px;
	overflow-y: auto;
}
.border {
	margin: 2px;
	padding: 2px;
	border: 0px solid black;
	text-align: left;
}
</style>

<div class="main">
	<div class="buttons">
        <ul>
        <li alt="1" class="active"><img src="http://ipic.su/img/img7/fs/osn.1400526060.png" alt="Основное"></li>
        <li alt="2"><img src="http://ipic.su/img/img7/fs/addm.1400526205.png" alt="Администрация"></li>
        <li alt="3"><img src="http://ipic.su/img/img7/fs/game.1400526275.png" alt="Игра"></li>
        <li alt="4"><img src="http://ipic.su/img/img7/fs/partn.1400526362.png" alt="Партнеры"></li>
        </ul>
    </div>

	<div class="content">
    <div id="c1">
    	<div class="in">
        <h3>Новости</h3>
        <div class="scroll border">
        	<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc at volutpat mi. Pellentesque et enim felis, sit amet imperdiet felis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nulla elit risus, volutpat a auctor a, luctus eget dolor. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Phasellus non purus eu orci varius consectetur vestibulum in velit. Nullam eu enim ut urna lacinia porttitor. Nam nec dui sit amet ligula volutpat rutrum vel non lectus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Pellentesque ornare adipiscing augue quis venenatis. Praesent nec sapien libero, id posuere erat. Aliquam tincidunt nunc nec eros mattis eget blandit elit dapibus. Integer ut mi magna. Fusce ut ligula nec lacus mollis dapibus vel convallis ligula.</p>
        	<p>Integer fermentum adipiscing nibh in porta. Cras massa augue, luctus at volutpat egestas, dignissim a leo. Proin eget egestas dui. Nulla dignissim commodo diam, ut euismod purus volutpat nec. Nunc pharetra hendrerit fringilla. Integer malesuada condimentum tellus, quis convallis nisi sagittis euismod. Aliquam consequat lobortis sodales. In id rutrum tortor. Aliquam id eros a velit elementum fringilla et ut dolor. Curabitur urna metus, lacinia quis luctus et, feugiat ut eros. Aenean sed malesuada nunc. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.</p>
        </div>
    	</div>
    	<div class="in">
        <h3>О форуму</h3>
        <div class="border">
        	Etiam nisl sapien, pretium id molestie sit amet, eleifend vel ante. Donec eleifend nulla vitae purus faucibus ultricies. Integer at diam eros, et imperdiet lectus. Mauris in enim erat. Vivamus id elit eget elit egestas condimentum ac vitae nulla.
        </div>
        <h3>Навигация</h3>
        <ul>
        	<li><a href="#">Ссылка 1</a></li>
        	<li><a href="#">Ссылка 2</a></li>
        	<li><a href="#">Ссылка 3</a></li>
        	<li><a href="#">Ссылка 4</a></li>
        	<li><a href="#">Ссылка 5</a></li>
        	<li><a href="#">Ссылка 6</a></li>
        	<li><a href="#">Ссылка 7</a></li>
        	<li><a href="#">Ссылка 8</a></li>
        </ul>
    	</div>
    </div>
    <div id="c2">
    	<h3>Администраторы</h3>
    	<img src="Ссылка на аватар" alt="Имя администратора 1" title="Описание администратора 1">
    	<img src="Ссылка на аватар" alt="Имя администратора 2" title="Описание администратора 2">

    	<h3>Модераторы</h3>
    	<img src="Ссылка на аватар" alt="Имя модератора 1" title="Описание модератора 1">
    	<img src="Ссылка на аватар" alt="Имя модератора 2" title="Описание модератора 2">
    	<img src="Ссылка на аватар" alt="Имя модератора 3" title="Описание модератора 3">
    </div>
    <div id="c3">
    	<div class="in">
        <h3>Погода и время</h3>
        <div class="scroll border">
        	<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc at volutpat mi. Pellentesque et enim felis, sit amet imperdiet felis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nulla elit risus, volutpat a auctor a, luctus eget dolor. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Phasellus non purus eu orci varius consectetur vestibulum in velit. Nullam eu enim ut urna lacinia porttitor. Nam nec dui sit amet ligula volutpat rutrum vel non lectus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Pellentesque ornare adipiscing augue quis venenatis. Praesent nec sapien libero, id posuere erat. Aliquam tincidunt nunc nec eros mattis eget blandit elit dapibus. Integer ut mi magna. Fusce ut ligula nec lacus mollis dapibus vel convallis ligula.</p>
        	<p>Integer fermentum adipiscing nibh in porta. Cras massa augue, luctus at volutpat egestas, dignissim a leo. Proin eget egestas dui. Nulla dignissim commodo diam, ut euismod purus volutpat nec. Nunc pharetra hendrerit fringilla. Integer malesuada condimentum tellus, quis convallis nisi sagittis euismod. Aliquam consequat lobortis sodales. In id rutrum tortor. Aliquam id eros a velit elementum fringilla et ut dolor. Curabitur urna metus, lacinia quis luctus et, feugiat ut eros. Aenean sed malesuada nunc. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.</p>
        </div>
    	</div>
    	<div class="in">
        <h3>События в игре</h3>
        <div class="scroll border">
        	<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc at volutpat mi. Pellentesque et enim felis, sit amet imperdiet felis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nulla elit risus, volutpat a auctor a, luctus eget dolor. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Phasellus non purus eu orci varius consectetur vestibulum in velit. Nullam eu enim ut urna lacinia porttitor. Nam nec dui sit amet ligula volutpat rutrum vel non lectus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Pellentesque ornare adipiscing augue quis venenatis. Praesent nec sapien libero, id posuere erat. Aliquam tincidunt nunc nec eros mattis eget blandit elit dapibus. Integer ut mi magna. Fusce ut ligula nec lacus mollis dapibus vel convallis ligula.</p>
        	<p>Integer fermentum adipiscing nibh in porta. Cras massa augue, luctus at volutpat egestas, dignissim a leo. Proin eget egestas dui. Nulla dignissim commodo diam, ut euismod purus volutpat nec. Nunc pharetra hendrerit fringilla. Integer malesuada condimentum tellus, quis convallis nisi sagittis euismod. Aliquam consequat lobortis sodales. In id rutrum tortor. Aliquam id eros a velit elementum fringilla et ut dolor. Curabitur urna metus, lacinia quis luctus et, feugiat ut eros. Aenean sed malesuada nunc. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.</p>
        </div>
    	</div>
    </div>
    <div id="c4">
    	<h3>Наши друзья</h3>
    	<div class="border" style="height: 100px; text-align: center;">Баннеры</div>

    	<h3>О рекламе</h3>
    	<div class="border scroll" style="height: 100px; width: 70%; margin: auto">
        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc at volutpat mi. Pellentesque et enim felis, sit amet imperdiet felis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nulla elit risus, volutpat a auctor a, luctus eget dolor. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Phasellus non purus eu orci varius consectetur vestibulum in velit. Nullam eu enim ut urna lacinia porttitor. Nam nec dui sit amet ligula volutpat rutrum vel non lectus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Pellentesque ornare adipiscing augue quis venenatis. Praesent nec sapien libero, id posuere erat. Aliquam tincidunt nunc nec eros mattis eget blandit elit dapibus. Integer ut mi magna. Fusce ut ligula nec lacus mollis dapibus vel convallis ligula.
    	</div>
    </div>
	</div>
</div>

<script>
$('#pun-announcement .buttons li').click(function() {
	$('#pun-announcement .buttons li').removeClass('active')
	alt = $(this).addClass('active').attr('alt');
	
	$('#pun-announcement .content > div').slideUp('slow');
	$('#pun-announcement .content > #c' + alt).slideDown('slow');
})
$('#pun-announcement .buttons li.active').trigger('click');

</script>

Тестовик, если нужно:
http://testzone.anihub.ru/

0

796

Убрать заливку:

.buttons ul li.active, .buttons ul li:hover {
  background-color: #808080;
}

удалите правило или замените выделение при наведении на что-то другое, например:

Код:
.buttons ul li.active img, .buttons ul li img:hover {
  background-color: rgba(255, 255, 255, 0.5);
  box-shadow: 0 0 15px rgba(255, 255, 255, 0.9);
}

(получится подсветка белая именно для картинки)


подвинуть с красного на синий (по рисунку) квадрат:

вот это:

.buttons ul {
  margin-top: 75px;
}

замените на

Код:
.buttons ul {
  margin-left: 20px;
  margin-top: 25px;
  text-align: center;
}

margin-left: 20px; - отступ слева (можно убрать вообще, оно и так неплохо)
  margin-top: 25px; - отступ сверху
  text-align: center; - выравнивание посередине, даже если кнопки будут меньше.

0

797

Ichimaru Gin
Спасибо! В который раз спасли)

0

798

Здравствуйте. Проблема с футером) Как убрать полоску что на скрине?

скрин

http://sb.uploads.ru/B30zi.png

http://mozartlokonte.artbb.ru/

0

799

Здравствуйте.
Есть проблема с расположением ссылок в профиле пользователя. Они наезжают на название доп. поля. Скрин.
Как это можно исправить/где ошибка?
http://lifeanimal.0pk.ru/

0

800

снимаю вопрос с:

доброты, сердечные.
на форум был установлен скрипт обтекания картинки текстом. с пользовательского аккаунта все работает, гости же видят это. этот баг как-то устраняется или только выпиливанием скрипта? а то жалко, удобная вещь

ой, вопрос снимается, простите, это оказался баг не кода, а админа *посыпает голову пеплом*

Отредактировано XDD (21.05.2014 21:59:02)

0


Вы здесь » Техническая поддержка сервиса Quadro.Boards » Оформление форумов » Вопросы по оформлению форума, дизайну и css (3)


Рейтинг форумов | Создать форум бесплатно © 2007–2016 «QuadroSystems» LLC