[Pan]

Стиль: Prosilver.
Что необходимо сделать: убрать из сообщений иконку back2top вместе со строчкой, которую она занимает.
Суть проблемы: при попытке удалить из viewtopic_body.html фрагмент

Код: Выделить всё

<div class="back2top"><a href="#wrap" class="top" title="{L_BACK_TO_TOP}">{L_BACK_TO_TOP}</a></div>

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

Код: Выделить всё

<div class="back2top">&nbsp;</div>

фон остаётся на месте, однако, естественно, сохраняется занимаемая им строчка.
Любой вариант перемещения данного фрагмента на другое место в шаблоне вызывает тот же эффект.
Копание в стилях ничего не дало, не могу понять суть проблемы.
Вопрос: где я дурак?

[FladeX]

theme/links.css

Код: Выделить всё

/* Back to top of page */
.back2top {
	clear: both;

Вот пропажа этого clear:both и приводит к таким последствиям (сбивается верстка). Возможные выходы - заменить этот div таким:

Код: Выделить всё

<div style="clear: both;">&nbsp;</div>

ЗЫ. Не проверял, отпишитесь.

[Pan]

FladeX
Попробовал, фон не исчез, форматирование не поползло. Однако пустая строчка осталась (что естественно - див-то на месте). Могут быть другие варианты решения? К чему можно "присобачить" <clear: both;>, дабы получить нужный результат?
Может быть, к кнопкам профайла, которые должны оказаться в последней строке? Но тогда вопрос - куда именно?

[Rayden]

я бы сделал clear: both; тому блоку, что идет после back2top

Добавлено спустя 4 минуты 36 секунд:
попробуй к <hr class="divider" />

[Pan]

Вот фрагмент кода, включающий этот див:

Код: Выделить всё

<!-- IF postrow.U_JABBER --><li class="jabber-icon"><a href="{postrow.U_JABBER}" onclick="popup(this.href, 550, 320); return false;" title="{L_JABBER}"><span>{L_JABBER}</span></a></li><!-- ENDIF -->
				</ul>
			</dd>
		<!-- ENDIF -->
		<!-- ENDIF -->

		</dl>
	<!-- ENDIF -->

<div style="clear: both;">&nbsp;</div>

	</div>
	<hr class="divider" />
<!-- END postrow -->

Бяка в том и заключается, что в пределах дива тела сообщения это последний фрагмент. Перенесение его за пределы построу форматирование ломает.

Попробовал к <hr class="divider" /> (сначала попробовал, потом увидел аналогичный совет)) - не работает, то же исчезновение фона и ломка формата.

[FladeX]

Код: Выделить всё

<div style="clear: both; display: none;">&nbsp;</div>

[Pan]

FladeX
Тоже не работает, лишняя строчка исчезла, попутно захватив с собой фон и форматирование

[FladeX]

Код: Выделить всё

<div style="clear: both; height: 1px; font-size: 1px; border: none; margin: 0; padding: 0; background: transparent;">&nbsp;</div>

[Pan]

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

[Rayden]

А что тебе мешает не удалять этот див, а лишь убрать из него ссылку, а вместо нее вставить свои кнопки?

[Pan]

Rayden
Мешает непонимание, как это правильно сделать. Собственно, к этой мысли приходил ещё сегодня с утра, в процессе поиска вариантов. Попробовал и так, и сяк - результат либо опять потеря форматирования, либо отсутствие кнопок.

Собственно, вот кусок кода, подскажете, как выполнить эту задачу правильно?

Код: Выделить всё

<!-- IF not S_IS_BOT -->
		<!-- IF postrow.U_PM or postrow.U_EMAIL or postrow.U_WWW or postrow.U_MSN or postrow.U_ICQ or postrow.U_YIM or postrow.U_AIM -->
			<dd>
				<ul class="profile-icons">
					<!-- IF postrow.U_PM --><li class="pm-icon"><a href="{postrow.U_PM}" title="{L_PRIVATE_MESSAGE}"><span>{L_PRIVATE_MESSAGE}</span></a></li><!-- ENDIF -->
					<!-- IF postrow.U_EMAIL --><li class="email-icon"><a href="{postrow.U_EMAIL}" title="{L_EMAIL}"><span>{L_EMAIL}</span></a></li><!-- ENDIF -->
					<!-- IF postrow.U_WWW --><li class="web-icon"><a href="{postrow.U_WWW}" title="{L_VISIT_WEBSITE}: {postrow.U_WWW}"><span>{L_WEBSITE}</span></a></li><!-- ENDIF -->
					<!-- IF postrow.U_MSN --><li class="msnm-icon"><a href="{postrow.U_MSN}" onclick="popup(this.href, 550, 320); return false;" title="{L_MSNM}"><span>{L_MSNM}</span></a></li><!-- ENDIF -->
					<!-- IF postrow.U_ICQ --><li class="icq-icon"><a href="{postrow.U_ICQ}" onclick="popup(this.href, 550, 320); return false;" title="{L_ICQ}"><span>{L_ICQ}</span></a></li><!-- ENDIF -->
					<!-- IF postrow.U_YIM --><li class="yahoo-icon"><a href="{postrow.U_YIM}" onclick="popup(this.href, 780, 550); return false;" title="{L_YIM}"><span>{L_YIM}</span></a></li><!-- ENDIF -->
					<!-- IF postrow.U_AIM --><li class="aim-icon"><a href="{postrow.U_AIM}" onclick="popup(this.href, 550, 320); return false;" title="{L_AIM}"><span>{L_AIM}</span></a></li><!-- ENDIF -->
					<!-- IF postrow.U_JABBER --><li class="jabber-icon"><a href="{postrow.U_JABBER}" onclick="popup(this.href, 550, 320); return false;" title="{L_JABBER}"><span>{L_JABBER}</span></a></li><!-- ENDIF -->
					<!-- IF postrow.U_GALLERY --><li class="gallery-icon"><a href="{postrow.U_GALLERY}" title="{L_PERSONAL_ALBUM}"><span>{L_PERSONAL_ALBUM}</span></a></li><!-- ENDIF -->
					<li class="top-icon"><a href="#wrap" title="{L_BACK_TO_TOP}"><span>{L_BACK_TO_TOP}</span></a></li>
				</ul>
			</dd>
		<!-- ENDIF -->
		<!-- ENDIF -->

		</dl>
	<!-- ENDIF -->

<div style="clear: both;">&nbsp;</div>

	</div>

[FladeX]

Pan, а как определили высоту? Цветом отличаться не должно, а по отступам - скорее всего соседние дивы такк расходятся. Проверяйте margin и padding у них.
(для теста пропишите цвет фона у этого слоя, сразу все станет понятным)

[Pan]

FladeX
Если не ошибаюсь, единственный класс, могущий на это влиять - profile-icons, а для него 3я цифра margin во всех css 0.

Добавлено спустя 5 минут 33 секунды:
Самое смешное, что перманентно промучавшись с этой задачкой два дня, пришёл к выводу о глупости данной дизайнерской задумки Если воплотить такой вариант, иконки профайла окажутся на нижней границе сообщения. Если сообщение короткое - всё отлично, а вот если оно на три страницы...

Отсюда сопутствующий вопрос (это было первым вариантом дизайнерского решения, но меня он сразу испугал сложностью воплощения)) - каким образом возможно "выстроить" иконки профайла (ЛС, мейл, веб и пр.) справа от аватарки, параллельно ей, вплотную к краю сообщения?
Насколько понял я, нужно в стилях формировать для этого отдельную колонку. Попробовав так и сяк, взялся за голову )

[FladeX]

Добавьте три <span>, у первого задайте ширину (ширина кнопок + нужный отступ), и float: left; (если инфа о юзере слева). у второго только float: left; третьему пропишите clear: both. Далее - в первый кладете кнопки, отделяя их друг от друга с помощью <br />, во второй - аватару. Третий пустой. Все это должно быть в отдельном <div>

[Pan]

FladeX
Благодарю за помощь. Пока не очень получилось, но (учитывая мою тупость в данном вопросе) возможно я что-то не так сделал.
viewtopic_body.html

Код: Выделить всё

<dl class="postprofile" id="profile{postrow.POST_ID}">
			<dt>
<span class="profileicons1"><!-- IF postrow.U_PM --><span class="pm-icon"><a href="{postrow.U_PM}" title="{L_PRIVATE_MESSAGE}"><span>{L_PRIVATE_MESSAGE}</span></a><br /></span><!-- ENDIF -->
					<!-- IF postrow.U_EMAIL --><span class="email-icon"><a href="{postrow.U_EMAIL}" title="{L_EMAIL}"><span>{L_EMAIL}</span></a><br /></span><!-- ENDIF -->
					<!-- IF postrow.U_WWW --><span class="web-icon"><a href="{postrow.U_WWW}" title="{L_VISIT_WEBSITE}: {postrow.U_WWW}"><span>{L_WEBSITE}</span></a><br /></span><!-- ENDIF -->
					<!-- IF postrow.U_MSN --><span class="msnm-icon"><a href="{postrow.U_MSN}" oncspanck="popup(this.href, 550, 320); return false;" title="{L_MSNM}"><span>{L_MSNM}</span></a><br /></span><!-- ENDIF -->
					<!-- IF postrow.U_ICQ --><span class="icq-icon"><a href="{postrow.U_ICQ}" oncspanck="popup(this.href, 550, 320); return false;" title="{L_ICQ}"><span>{L_ICQ}</span></a><br /></span><!-- ENDIF -->
					<!-- IF postrow.U_YIM --><span class="yahoo-icon"><a href="{postrow.U_YIM}" oncspanck="popup(this.href, 780, 550); return false;" title="{L_YIM}"><span>{L_YIM}</span></a><br /></span><!-- ENDIF -->
					<!-- IF postrow.U_AIM --><span class="aim-icon"><a href="{postrow.U_AIM}" oncspanck="popup(this.href, 550, 320); return false;" title="{L_AIM}"><span>{L_AIM}</span></a><br /></span><!-- ENDIF -->
					<!-- IF postrow.U_JABBER --><span class="jabber-icon"><a href="{postrow.U_JABBER}" oncspanck="popup(this.href, 550, 320); return false;" title="{L_JABBER}"><span>{L_JABBER}</span></a><br /></span><!-- ENDIF -->
					<!-- IF postrow.U_GALLERY --><span class="gallery-icon"><a href="{postrow.U_GALLERY}" title="{L_PERSONAL_ALBUM}"><span>{L_PERSONAL_ALBUM}</span></a><br /></span><!-- ENDIF --></span>

<span class="profileavatar1"><!-- IF postrow.POSTER_AVATAR -->
					<!-- IF postrow.U_POST_AUTHOR --><a href="{postrow.U_POST_AUTHOR}">{postrow.POSTER_AVATAR}</a><!-- ELSE -->{postrow.POSTER_AVATAR}<!-- ENDIF --><br />
				<!-- ENDIF --></span>

<span class="profileboth1">&nbsp;</span>
				<!-- We use "\r\n" newline here because insert_text() JS function doesn't insert newline with "\n" (at least in Windows) -->
				<!-- IF QUICK_REPLY --><a href="#postform" onclick="insert_text('[b]{postrow.POSTER_QUOTE}[/b]\r\n'); return false;"<!-- IF postrow.POST_AUTHOR_COLOUR --> style="color: {postrow.POST_AUTHOR_COLOUR}" <!-- ENDIF -->>{postrow.POST_AUTHOR}</a><!-- ELSE --><!-- IF not postrow.U_POST_AUTHOR --><strong>{postrow.POST_AUTHOR_FULL}</strong><!-- ELSE -->{postrow.POST_AUTHOR_FULL}<!-- ENDIF --><!-- ENDIF -->&nbsp;&nbsp;<!-- IF postrow.S_ONLINE --><span style="color: green;">	<BLINK>{L_ONLINE}</BLINK></span> <!-- ELSE -->&nbsp;<!-- ENDIF -->
			</dt>

bidi.css

Код: Выделить всё

.profileicons1 {
	width: 26px;
	float: left;
	}
	
.profileavatar1 {
	float: left;
	}

.profileboth1 {	
	clear: both;
	}

Иконки с откуда-то взявшимся текстом подписей оказались над аватаркой.

Что получилось

sshot-01.jpg (6.07 КБ) Просмотров: 410

Где ошибка?