Перейти к содержанию

Рекомендуемые сообщения

Извините за глупый вопрос, но не могу выравнить цену на главной в модуле рекомендуемые. В css сделал цену жирной и выровнил по центру. А вот вертикальное выравнивание не получается. Хотелось бы, что бы цена была на одной высоте от кнопки "В корзину". vertical-align: bottom;  в данном случае не работает.

 

Screenshot_1.png.376855f93ffc4020ad2e403991204f1e.png

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Или min-height названию пропишите, или через позиционирование.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
Только что, todaymars сказал:

Или min-height названию пропишите, или через позиционирование.

 

А можно подробнее?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Помогите пожалуйста решить эту проблему!! Как сделать чтобы все окна были одного размера в независимости от того если есть описание товара или нет. Спасибо огромное за ранее!!!

123.PNG

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для родительского блока можно прописать 

  display: -webkit-box;      
  display: -moz-box;         
  display: -ms-flexbox;      
  display: -webkit-flex;     
  display: flex;        
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;

 

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Мне лично не помогло.Но спасибо за ответ

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Киньте ссылку.Думаю можно разобраться будет. Если есть <div class="product-thumb"> пробуйте для него прописать height:100%    

Изменено пользователем freeyourmind2

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
2 часа назад, iura93 сказал:

http://robinet.md/ добавил но всё равно не помогло(

https://prnt.sc/hc23on   

Для class="row" добавляем 

 display: -webkit-box;      
  display: -moz-box;         
  display: -ms-flexbox;      
  display: -webkit-flex;     
  display: flex;        
  -webkit-flex-wrap: wrap;
  flex-wrap: wrap;

а для product-thumb

height:100%

 

Снимок экрана от 2017-11-18 14-58-19.png

Снимок экрана от 2017-11-18 14-58-41.png

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Грубое, но рабочее решение:

 

.caption h4 {

    height: 75px;

}

 

.caption > p:nth-of-type(1) {

    height: 145px;

}

Но надо проверить вывод товаров на разных страницах сайта,  при различных разрешениях экрана. Также при разном отображении (Сетка/Лист)

Скорее всего, придется чуть подправить.

Также надо будет посмотреть на разных разрешениях экрана. 

Возможно придется дополнить стилями с медиазапросами.

 

нет, не так...

У вас Товары в Категориях правильно отображаются

Просто задайте для модулей АНАЛОГИЧНУЮ разметку ( широкие блоки вместо узких) с учетом левого бокового меню, вам класс col-lg-3 не подходит- сильно зауживает блоки товаров в модулях

если их поменять на col-lg-4 col-md-4

Все станет как надо

<div class="product-layout col-lg-4 col-md-4 col-sm-6 col-xs-12"> ( это можно попробовать в Инспекторе кода, для трех соседних блоков.

Сразу станет хорошо.

Но это при условии, что модули выводятся только на Главной. И при наличии бокового меню.

 

Как вариант, можно просто переписать стили для 

 

 .common-home .product-layout.col-lg-3 {

     width:33.33333333% !important; 

}

и

@media (max-width: 992px) {

    .common-home .product-layout.col-md-3 { 

        width:33.33333333% !important;

    }

}

Этот вариант самый быстрый по применению

НО придется еще поразбираться со стилем

@media (min-width: 1200px)

stylesheet.css:718

#content .col-lg-2:nth-child(6n+1), #content .col-lg-2:nth-child(6n+1), #content .col-lg-3:nth-child(4n+1), #content .col-lg-4:nth-child(3n+1), #content .col-lg-6:nth-child(2n+1) {

/* clear: left; */

}

и

@media (max-width: 1199px) and (min-width: 992px)

stylesheet.css:727

#content .col-md-2:nth-child(6n+1), #content .col-md-2:nth-child(6n+1), #content .col-md-3:nth-child(4n+1), #content .col-md-4:nth-child(3n+1), #content .col-md-6:nth-child(2n+1) {

/* clear: left; */

}

Он как-бы делает перенос блоков на следующую строку и борется с "цеплянием" блоков друг за друга. А цепляются они только при разной высоте.

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

А это стиль отменить.

 

Или не меняя разметку в Схемах уберите Меню категорий из Левой части

Можете просто в инспекторе кода правой кнопкой кликнуть на aside и нажать Delete элемент.

А потом для блока контента пропишите col-sm-12

Ну, красота же ???

Зачем вам это боковое меню?

 

Другой вариант:

Есть скрипт выравнивания высоты блоков по максимальному. Используется в бесплатном  шаблоне FastFood. Можете оттуда его вытащить.

 

P.S. 

Зачем у вас в описании товара полностью повторяется его название причем большими буквами?

Это- дурной тон.

ПРОВОДНОЙ КОНТРОЛЛЕР ТЕРМОСТАТИЧЕСКИХ КЛАПАНОВ (8 СЕКЦИЙ)

 

P.P.S.

Если описаний ко многим товарам не будет, то будет много пустот в мини-карточках товаров в Категориях.

Как вариант, можно переверстать так, чтобы описание показывалось при наведении. Как характеристики на "Розетке"

А вывод описания в модулях, как мне кажется надо вообще отключить.

 

 

Изменено пользователем jaffagold

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для <div class="row" > ничего добавлять не надо - ищите другое решение.

 

Например, уберите описание везде. Просто вырезать из шаблона. А зачем оно там?

Изменено пользователем florapraktik

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
43 минуты назад, florapraktik сказал:

Для <div class="row" > ничего добавлять не надо - ищите другое решение.

 

Например, уберите описание везде. Просто вырезать из шаблона. А зачем оно там?

Почему ? Можно добавить туда например класс flex-row и для него применить стили. Flex поддерживается современными браузерами.) 

Есть хорошая статья про кроссбраузерность . https://css-tricks.com/using-flexbox/ .

Изменено пользователем freeyourmind2

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

.row Не надо трогать. Это ничего не дает.

По крайне мере 3 способа описано выше.

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты
2 минуты назад, freeyourmind2 сказал:

 Можно добавить туда например класс flex-row и для него применить стили.

Так, Да.

Я хотел сказать, что не надо переопределять поведение самого класса row.

Ну, я Вас так понял почему-то.:)

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

 

6 минут назад, florapraktik сказал:

Так, Да.

Я хотел сказать, что не надо переопределять поведение самого класса row.

Ну, я Вас так понял почему-то.:)

Ну это да .  Подумал что не  переопределять класс .row это понятно  )

 

10 минут назад, jaffagold сказал:

.row Не надо трогать. Это ничего не дает.

По крайне мере 3 способа описано выше.

https://prnt.sc/hc23on    На скрине видно что карточки ровные.   

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Если модификатором добавить у всех модулей  доп класс для div.row, например div class="row row-flex"

И писать стили для него. То тогда- да. 

Что говорит статистика? Какой процент пользователей не увидит красоту?

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Тут вот такая статистика.

  display: -webkit-box;      /* OLD - iOS 6-, Safari 3.1-6 */
  display: -moz-box;         /* OLD - Firefox 19- (buggy but mostly works) */
  display: -ms-flexbox;      /* TWEENER - IE 10 */
  display: -webkit-flex;     /* NEW - Chrome */
  display: flex;             /* NEW, Spec - Opera 12.1, Firefox 20+ */

Вроде как бы неплохо )

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Спасибо вам большое!!! Я новичок полный по этому поводу так что буду разбираться с полученной инфой. Счастья и здоровья вам и вашим близким!!!

Поделиться сообщением


Ссылка на сообщение
Поделиться на другие сайты

Для публикации сообщений создайте учётную запись или авторизуйтесь

Вы должны быть пользователем, чтобы оставить комментарий

Создать учетную запись

Зарегистрируйте новую учётную запись в нашем сообществе. Это очень просто!

Регистрация нового пользователя

Войти

Уже есть аккаунт? Войти в систему.

Войти

  • Последние посетители   0 пользователей онлайн

    Ни одного зарегистрированного пользователя не просматривает данную страницу

×

Важная информация

На нашем сайте используются файлы cookie и происходит обработка некоторых персональных данных пользователей, чтобы улучшить пользовательский интерфейс. Чтобы узнать для чего и какие персональные данные мы обрабатываем перейдите по ссылке. Если Вы нажмете «Я даю согласие», это означает, что Вы понимаете и принимаете все условия, указанные в этом Уведомлении о Конфиденциальности.