0 Пользователей и 1 Гость просматривают эту тему.
  • 3 Ответов
  • 963 Просмотров
*

fragmatic92

  • Новичок
  • 2
  • 0 / 0
Адаптивность колонок Joomla
« : 04.11.2016, 19:28:17 »
Joomla 3 , шаблон от Artisteer
Имеется вывод материала в блоке категорий, по 2 - 4 колонки.
При уменьшении ширины окна, статьи не перемещаются друг под друга,  надо чтоб статьи перемещались друг под друга (вместо 2 - 4 колонок выводилась одна ).

Ранее натыкался на подобные темы http://joomlaforum.ru/index.php?topic=286224.0 - ответа для себя не нашел.

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

Strikerus

  • Захожу иногда
  • 103
  • 7 / 0
  • Aka Smyke
Re: Адаптивность колонок Joomla
« Ответ #1 : 07.11.2016, 10:38:46 »
Artisteer- дикое зло, учитесь работать руками.
А вообще, для того чтобы решить вашу проблему нужна ссылка на опубликованный сайт, дабы нам увидеть что из себя представляет данный шаблон. В слепую могу только дать совет:
- Научитесь пользоваться FireBug
- Используя FireBug изучите CSS на готовых примерах, достаточно просто некоторое время поэкспериментировать
*

fragmatic92

  • Новичок
  • 2
  • 0 / 0
Re: Адаптивность колонок Joomla
« Ответ #2 : 07.11.2016, 13:10:00 »
Ну первое ссылка - http://only-football.ru/pryamye-translyatsii-futbolnykh-matchej

FireBug активно использую и понятия про стили имею . В firebuge все выходит сделать но не могу найти это в корне сайта . вот в чем проблема
http://prntscr.com/d44as1
http://prntscr.com/d44aux
*

Strikerus

  • Захожу иногда
  • 103
  • 7 / 0
  • Aka Smyke
Re: Адаптивность колонок Joomla
« Ответ #3 : 08.11.2016, 05:28:56 »
Ну вот смотри, для того, чтобы выстроилась нормальная сетка из элементов, тебе необходимо привести их к одному размеру, а именно добавить строки, указанные в скриншоте, к классу .item
Спойлер
[свернуть]

Теперь по поводу 1 колонки при малой ширине экрана:
Достаточно использовать чудесный медиа-запрос @media, который позволит нам установить ширину колонки в 100% на малом экране

Код
.item {
    height: 200px;
    overflow: hidden;
    margin: 5px;
}
@media screen and (max-width: 1920px) {
  .item {
    width: 200px;
  }
}
@media screen and (max-width: 600px) {
  .item {
    width: 100%;
  }
}

Приведенный выше код просто добавляем в конец CSS файла шаблона Joomla
« Последнее редактирование: 08.11.2016, 08:30:43 от Strikerus »
Чтобы оставить сообщение,
Вам необходимо Войти или Зарегистрироваться
 

Как поставить такой курсор на сайт Joomla?

Автор Romanych

Ответов: 0
Просмотров: 678
Последний ответ 05.11.2020, 21:45:29
от Romanych
Вопрос по CSS Joomla 3+

Автор HomoSapiens

Ответов: 8
Просмотров: 1166
Последний ответ 02.11.2020, 16:30:48
от Verhov526
Несколько вопросов про шаблон (Joomla! 3.9.1)

Автор int31

Ответов: 6
Просмотров: 933
Последний ответ 09.02.2020, 20:28:49
от AlexB
[Решено] UiKit: сетка на 12 колонок, а также на 7, 8, 9 и (для uikit3) 10

Автор AlekVolsk

Ответов: 1
Просмотров: 3895
Последний ответ 08.08.2019, 19:02:41
от AlekVolsk
Как добавить сторонние кнопки CSS в модули и плагины Joomla?

Автор bayersoff

Ответов: 12
Просмотров: 5041
Последний ответ 23.12.2018, 17:42:46
от effrit