[Решено] Адаптивный блог (3 колонки в одну) - Joomla 2.5: Общие вопросы

Добрый день!
Возможно ли сделать вывод статей в виде блога с адаптивными настройками?
В блоге статьи выводятся в 3 колонки, и при уменьшении ширины окна, надо чтоб статьи перемещались друг под друга. При минимальной ширине, например с телефона, оставалась одна колонка.

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

Можно ручками через
@media (min-width: 768px) {}
переопределить параметры стилей,
 или подгрузить bootstrap http://bootstrap-ru.com/scaffolding.php#responsive,
или же оригинальную версию http://getbootstrap.com/css/#responsive-utilities

min-width, max-width и display:inline-block достаточно.

Спасибо) но что-то не выходит))
Максимум чего удается добиться, это уменьшения объектов внутри блока
вот ссылка: http://seveneighths.ru/nashi-proekty  , но они остаются в один ряд.
При display:block они начинает налезать друг на друга, похоже сам модуль вывода статей (в виде блога) создает сетку (как таблица), поэтому переноса и не может быть.

Возможно и правда стоит поискать модуль блога, который так умеет. Пока еще не нашел.

Кстати, интересно,  читал про 3 Joomla, пишут там адаптивный дизайн, не в курсе как там блоки статей перемещаются друг под друга или так же как 2.5?

В 3-й эти Проблемы решены в базовом шаблоне

SmYk, это потому что вы невнимательно прочитали моё сообщение.

.art-layout-cell {display:inline-block;}

Ну и обёртки лишние удалите, которы на строки делят ваши блоки.

Поможет если просто прописать в конец таблицы CSS
@media (min-width: 768px){
   .items-row .item {
   display: inline-block;
   }
}

У ТС там по три блока обёрнуты типа строками. Всё равно придётся вёрстку править. А то при уменьшении ширины получаются строки по 2, 1, 2, 1… блока.

ЕЕЕ)))) Получилось)  Спасибо огромное! И особенно за разъяснения..я не спец в коде, но потихоньку догоняю)
по 2 1 2 1..подумаю че с этим делать

Shustry
Есть статья http://incubator-mail.com.ua/ctati/13-upravlenie-elektronnym-termoregulyatorom
В ней некорректоно работает верстка, привожу первый глюк, остальный похожие
<div class="items-row cols-2 row-0 row-fluid well well-mb0">
            <div class="item column-1 span8 ">
               <p>На табло появляются буквы ПУС.</p>
               <P>
                  Контроллер переходит в режим ожидания перезапуска счетчика дней инкубации - установку в ноль (00d).
               </P>
            </div>
....
Причем как-то через один.
Некорректность заключается в следующем
на стационарном компе при сжимании экрана до 270рх (Хром) все отображается корректно, на айфоне -коррктно,
на Галакси (320рх) дивы уходят за размер контейнера (немного, пикселей на 15-20), но некрасиво.
Где найти решение. Или махнуть рукой?

ShfVD, наверное махнуть рукой. У меня нет никаких девайсов для теста, потому мобильной вёрсткой я не занимаюсь.

Решит проблему

Ну или без медия запроса, просто нужно посмотреть может что зависит на большом экране.

У вас просто проблема в том что вы не верно классы указали в HTML

row-fluid должна оборачивать колонки она имеет ширину 100%
но вы добавили класс well который несет в себе оформление  padding:10px;
получается у вас контейнер имеет ширину 100% + 20px (отступов 10px справа и слева), это можно исправить с помощью box-sizing или применить bootstrap правильно

Спасибо большое.
Не понял

Ну или без медия запроса, просто нужно посмотреть может что зависит на большом экране.

Там действительно 20рх выпрлзают.
box-sizing: border-box; почему-то не помог,  применить bootstrap правильно учусь,
главное понял в чем лохонулся (хотел div сэкономить, вот и напихал в один кучу классов) -понятно, куда грести, думаю разгребусь.

попробуйте так

Видать там андройд совсем древний

андроид 2.3.3, впрочем, Бог с ним.
Надеюсь добавлю новую обертку, куда перенесу все свои классы и пошепчет.
Кстати о кроссбраузерности, насколько актуально прописывать в CSS -moz, -webkit.
Мне кажется, что это за бугром актуально, а наш брат ИЕ используют мало, да и обновляются регулярно, или я не прав

Причем тут ie? Он как раз поддерживает это свойство еще с ie8. А ответы даст вам этот сайт http://caniuse.com/#search=box-sizing там есть табличка по браузерам и по префиксам для различных свойств. К примеру видно что для android 2.3 нужен префикс

Возвращаясь к вопросу о 2,1,2,1,  поставил вывод в 333 колонок ))) соответственно все статьи выводятся в ряд и переносятся если достигают предела поля... не знаю на сколько это правильно, пока так) багов вроде не наблюдается.