VA_ic2b: Немного не понял каким образом мне это сделать при генерации страницы. Сам код страницы генерируется в content-product_cat.php Там (в коде php) я могу дописать во что мне оборачивать категорию. В row_fluid или в table-row или в свой класс. Я не могу менять css на этапе генерации странице же....?
Хм. С блоками у меня проблема. как вы могли заметить)) Недостаток понимания возможностей и свойств элементов.
Было бы более наглядно взглянуть на некоторый пример, если таковой где-нибудь есть.
А сценарий у меня простой.
В десктоп варианте
контент область делим на 2 колонки для вывода списка категорий. Как я выше в ссылке указывал.
То есть есть строка, которая делится на 2 условных колонки(или 2 блока, я не знаю). Под ней еще строка, которая делится на 2 условных колонки. И так далее, пока не будет выведен весь список.
В вышеприведенной ссылке это показано наглядно. Так же в этой ссылке, как вы могли заметить, высота левого и правого элементов(или блоков?) равны, что выглядит аккуратно и не "порвано".
Внутри каждого элемента я планирую уже "расписать" саму контент-составляющую.
Это наименование категории, это картинка категории, это текстовое наполнение описания категории и ссылка подробнее.
То есть элемент у меня будет состоять из 3 строк.
Первая строка блока: ширина 100% родит. элемента. - Наименование категории
Вторая строка блока: - блоки 3/12 от ширины (картинка) и 9/12 от ширины (описание категории).
Третья строка: ширина 100% - ссылка "подробнее"
В мобильной версии
Контент-область в одну колонку. То есть каждая следующая категория под предыдущей.
Здесь уже высота элементов -по контенту, ведь левых и правых нет, выравнивать нечего.
Внутри этого блока дочерние выстраиваются один под другим с порядком left-to-right
То есть
Первая строка - наименование категории
Вторая строка - картинка
Третья строка - Описание категории
Четвертая строка - ссылка "подробнее"
Еще одна особенность в том, что при выводе категорий (в коде шаблона) есть возможность узнать первый это или последний элемент в строке, можно узнать количество колонок, предусмотренное для десктопа, но узнать мобильная версия сайта показывается или десктопная можно узнать только в css, если я все правильно понимаю.
То есть мне нужно каждую выводимую строку обернуть в table-row. Не вопрос - обернем.
А каждую выводимую в строке категорию в table-cell соответственно. Тоже не вопрос, обернем.
Тогда вопрос: как в css указать, что каждый table-cell должен перемещаться на следующую строку за предыдущим, если разрешение экрана такое-то?
Спасибо. Не похоже на резиновое, но тем не менее в контексте моего вопроса так же удовлетворяет решению. Как доработать решение, чтобы блоки при определенном разрешении экрана выстраивались друг под другом? Если не затруднительно. Хотелось бы чтобы на мобильном сайт оставался удобочитаемым. Я по этому bootstrap использовал.
Задать конкретную высоту не получится, так как ячейки по высоте должны тянуться в зависимости от контента.
Извините за вопрос, я не верстальщик, я только учусь, в данном случае row-fluid не является разве строкой, а span-ы ячейками внутри этой строки?
скрипт не хотелось бы использовать (я так понимаю для вычисления высоты текущей строки), так как это таксономия woocommerce, кто знает сколько элементов на страницу выберет пользователь. Лишняя нагрузка на клиента.
Написано
Войдите на сайт
Чтобы задать вопрос и получить на него квалифицированный ответ.