Убрать правый блок в полной новости, при этом центральная часть должна растянуться по всей ширине

mastodontoff 05.12.2013 css, js, tpl Общие вопросы по вёрстке, Стили (CSS) 3896

вопрос

Доброго дня. Помогите решить вопрос. Необходимо, что бы при просмотре полной новости, если правый блок скрывается при помощи тега not-aviable, центральный блок растягивался на всю оставшуюся ширину сайта.
Пример: Все три блока на месте

Теперь в полной новости мы тегом not-aviable убираем правый блок rightsidebar, получается он просто не отображается, а центральный блок т.к имеет фиксированную ширину находится на том же месте.

Вопрос: Как сделать правильную верстку из трех блоков, чтобы при скрытии правого блока центральный растягивался на всю ширину сайта.

Спасибо.

Ответил: ПафНутиЙ

добавляйте к блоку main класс, через тег aviable, который будет задавать ширину блока.

4 комментария

Юзер

Е.Хрущёв - 2015-02-2113 июня 2014 21:19 - #30103

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

Юзер

151

shadow6630 - 2015-02-2113 июня 2014 21:21 - #30104

Читайте документацию , а конкретно про тег aviable - создаеете два разных класа для центрального блока с разной шириной и прячете в тег aviable и будет вам счастье (как выше написал Пафнутий)

Юзер

1599

FastFud - 2015-02-2113 июня 2014 21:31 - #30105

В main.tpl

[aviable=main]
<div class="blockMain"></div>
[/aviable]
[aviable=showfull]
<div class="blockFull"></div>
[/aviable]


.blockMain {
width: 400px;
}
.blockFull {
width: 240px;
}

Юзер

Е.Хрущёв - 2015-02-2113 июня 2014 21:53 - #30109

Спасибо добрый человек, помог ^^

Nimax | Создание простого сайта отзывов (рейтинг ... ⁵

Nimax
Создание простого сайта отзывов (рейтинг и сортировка) - модуль PostReviews
25-04-2024, 17:18

Странный вы, это как минимум в ваших интересах т.к модули с рейтингами для комментариев есть и в паблике, поэтому и хочется посмотреть как это реализовано у вас. Стоимость то не низкая для модуля
New-dev.ru | Создание простого сайта отзывов (рейтинг ... ⁵

New-dev.ru
Создание простого сайта отзывов (рейтинг и сортировка) - модуль PostReviews
24-04-2024, 14:14

А что там на фронте на скрине или демо смотреть? Там в стандартную форму добавления комментария просто добавляется рейтинг, например, звездный.
TeraMoune | Сделать модуль опросы ³

TeraMoune
Сделать модуль опросы
22-04-2024, 13:32

Конечно. Пишите в телеграм.
Nimax | Сделать модуль опросы ³

Nimax
Сделать модуль опросы
22-04-2024, 13:17

Да в том и дело =) так и думал можете сделать? сколько будет по стоимости?
TeraMoune | Сделать модуль опросы ³

TeraMoune
Сделать модуль опросы
22-04-2024, 12:56

Зачем же для этого модуль ? Есть стандартные опросы, достаточно добавить одну правку на обработку тега в описании новости от стандартного тега poll.
Nimax | Создание простого сайта отзывов (рейтинг ... ⁵

Nimax
Создание простого сайта отзывов (рейтинг и сортировка) - модуль PostReviews
22-04-2024, 12:14

А есть скрины или демо как это на фронте выглядит?
New-dev.ru | Создание простого сайта отзывов (рейтинг ... ⁵

New-dev.ru
Создание простого сайта отзывов (рейтинг и сортировка) - модуль PostReviews
21-04-2024, 18:25

Эта старая публикация, за несколько месяцев цена выросла, а тут забыл исправить цену, сожалею. Сейчас поставил актуальную цену.
Nimax | Создание простого сайта отзывов (рейтинг ... ⁵

Nimax
Создание простого сайта отзывов (рейтинг и сортировка) - модуль PostReviews
21-04-2024, 13:18

Как преобрести за 9$? на сайте цена другая
Jigurda | Как в description вставить значение доп. ... ²

Jigurda
Как в description вставить значение доп.поля?
19-04-2024, 10:54

Немного не то. Нужно не заменить, а добавить к уже имеющемуся description свой текст с доп.полями
lutskboy | Как в description вставить значение доп. ... ²

lutskboy
Как в description вставить значение доп.поля?
18-04-2024, 21:51

https://sandev.pro/web/159-fullstory-metatags-by-sander.html