Форум » Полезное для Борды » Изменяем соотношение между столбцами авторов и сообщений » Ответить

Изменяем соотношение между столбцами авторов и сообщений

Geek: По умолчанию, на форумах Борды соотношение между шириной левого столбца темы (краткая информация об авторе) и правого (текст сообщения) составляет 25 / 75%. Лично мне нравится, когда столбец с аватаром автора занимает не больше 15% от отведённого места. Соотношение столбцов задаётся в атрибутах width тегов TD, формирующих разметку таблицы с сообщениями, но, чтобы это изменить, можно обойтись без скриптов. Дело в том, что стили, заданные внутри тега STYLE в HTML-верх имеют приоритет над значениями этих атрибутов, поэтому для достижения цели достаточно записать всего несколько стилевых правил для интересующих нас элементов страницы. Сейчас (2019.12.05) ширины столбцов таблицы с сообщениями задаются: 1) в первом и втором теге TD первой строки таблицы с id "posts-table" (заголовки "Автор" и "Сообщение"); 2) в первом теге TD предпредпоследней строки таблицы с id "posts-table" (заголовок "Ответ:" в форме ответа); 3) в первом теге TD предпоследней строки таблицы с id "posts-table". (панелька смайликов в форме ответа) Соответственно, CSS-правила, помещаемые перед </STYLE>, будут выглядеть так (синим выделены вожделенные 15 процентов, отводимых на столбец с краткой информацией об авторе): [quote]/* изменяем ширины столбцов "Автор" и "Сообщение" в темах */ #posts-table > tbody > tr:nth-child(1) > td:nth-child(1) { width:15%; } /*заголовок "Автор"*/ #posts-table > tbody > tr:nth-last-child(3) > td:nth-child(1) { width:15%; } /*заголовок "Ответ:"*/ #posts-table > tbody > tr:nth-last-child(2) > td:nth-child(1) { width:15%; } /*панелька смайликов*/[/quote] Правило для второго тега TD в (1) здесь не указано, потому что, как показала практика, это необязательно. Для спокойствия, можно добавить правило и для него (ширина столбца с сообщениями = 100% - 15% = 85%): [quote]#posts-table > tbody > tr:nth-child(1) > td:nth-child(2) { width:85%;} /*заголовок "Сообщение"*/[/quote]

Ответов - 0



полная версия страницы