Перейти к публикации
Поиск в
  • Дополнительно...
Искать результаты, содержащие...
Искать результаты в...

Как выравнить цену


susha
 Поделиться

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

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

 

Screenshot_1.png.376855f93ffc4020ad2e403991204f1e.png

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


Только что, 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
Ссылка на комментарий
Поделиться на других сайтах


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