• Никакой политики на форуме. Иначе - бан!
  • Вопрос без рабочей ссылки на проблему считается риторическим. Без ссылки и скриншота - провокацией!
  • Темы озаглавленные с маленькой буквы или капсом удаляются без предупреждения!

Решено Отображение единицы измерения товара

tuxfighter

Гуру
Местный
CSS:
.single-product .entry-summary .quantity {
    margin-right: -5px !important ;
}
.single_add_to_cart_button {
    margin-left: -5px !important;
}
 

a.kalugin

Форумчанин
Все, разобрался! Кажется, с вашей помощью, начал понимать, как работает css))
такой код:
CSS:
.qty-suffix {
    border: solid 1px #d5d5d5;
    padding: 12px;
    padding-bottom: 6px;
    margin-top: 5px !important;
    margin-left: 1px !important;
    margin-right: 5px !important;
}
и все отображается нормально
 

a.kalugin

Форумчанин
Чуть меня опередили, попробовал и ваш способ - тоже работает!
 

a.kalugin

Форумчанин
Курс посмотрел, начинаю вникать в азы, оказывается не все так сложно, как я себе представлял ))
правда есть один момент, может поможете мне: я не могу никак выровнять текст по центру внутри данного блока. Получается что он по вертикали у меня чуть вниз находится. Пробовал добавлять свойства
CSS:
vertical-align: middle; text-align: center;
так же добавлял
CSS:
display: table-cell;
но никакого результата это не дало, как был он чуть ниже, так и остался.
 

tuxfighter

Гуру
Местный
а так и не получится - рамка паддингами распирается.
По этому нужно играть со значениями padding-top и padding-bottom
 

a.kalugin

Форумчанин
Огромное спасибо!
Все получилось! :)
CSS:
.qty-suffix {
    border: solid 1px #d5d5d5;
    padding: 13px;
    padding-top: 9.5px;
    padding-bottom: 9.5px;
    margin-top: 5px !important;
    margin-left: 1px !important;
    margin-right: 5px !important;
    font-size: 15px;
        }
 

a.kalugin

Форумчанин
Есть еще вопрос - можно как то это дело применить к мобильной версии сайта ? С телефона почему то отображается рамка чуть меньше по высоте, пробовал на 2 телефонах и 2 разных браузерах
 

tuxfighter

Гуру
Местный
да - написать стили для меньшего разрешения экрана.
почитайте про медиазапросы в css
получится что-то типа такого:
CSS:
@media (max-width: 860px) {
       .qty-suffix {
    padding-top: 10px;
    padding-bottom: 11px;
        }
 }
 
Сверху Снизу