Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
  • Sign Up

Адаптивное размещение jpg


Recommended Posts

Добрый день.

Помогите адаптивно вставить иконки платежных систем в карточку товара.

Вставляемый jpg правильно отображается только на ПК.

На мобильных устройствах он вылетает за пределы вызывая горизонтальный скролинг.

Спасибо.

 

image.thumb.png.bd33ec487c62e76f05bd5bc0be0b97a2.png

Link to post
Share on other sites

5 минут назад, Esox сказал:

Добрый день.

hidden-md ему приделайте, чтобы не отображался на мобильных, в любом случае его не видно станет из-за масштабирования.

либо на мелкие картинки покрашите и сверстайте. :wacko:

  • +1 1
Link to post
Share on other sites
9 часов назад, theRGD сказал:

hidden-md ему приделайте, чтобы не отображался на мобильных, в любом случае его не видно станет из-за масштабирования.

либо на мелкие картинки покрашите и сверстайте. :wacko:

 

Ну а все-таки, если масштабировать?

Я хотел попробовать, насколько будет читаемым....

 

Я сделал так:
 

              <div class="hidden-md-up">
                  <span>Принимаем к оплате:</span>
                  </br>
                  <img src="/image/payment/payment.png" width="450">

              </div>

 

Правильно?

Edited by Esox
Link to post
Share on other sites

13 минут назад, Esox сказал:

Ну а все-таки, если масштабировать?

Если хотите, чтоб картинка была адаптивной, не задавайте ей ширину, а поставьте

max-width: 100%;

Тогда она будет подстраиваться под родительский блок.

Link to post
Share on other sites

38 минут назад, Dotrox сказал:

Если хотите, чтоб картинка была адаптивной, не задавайте ей ширину, а поставьте


max-width: 100%;

Тогда она будет подстраиваться под родительский блок.

 

max-width: 100%;

 

Никак не влияет.

Пробовал и после: 

<img src="/image/payment/payment.png" max-width: 100%;>

и в отдельный класс вынес.

результата нет.

Link to post
Share on other sites

17 минут назад, Esox сказал:

<img src="/image/payment/payment.png" max-width: 100%;>

А где вы такое вообще видели? Атрибута max-width не существует, это можно добавлять только через стили.

И второе - у родительского блока должны быть размеры и ограничения содержимого.

Что-то конкретнее смогу подсказать только увидев сайт.

Link to post
Share on other sites

Спасибо вам.

Через стили тоже не получается.

Сайт на локалке ((.

 

Link to post
Share on other sites

12 минут назад, theRGD сказал:

<img src="/image/payment/payment.png" width="450" class="img-responsive" />

 

 

Замечательно!!!

Спасибо огромное, работает.

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    No registered users viewing this page.

×
×
  • Create New...

Important Information

On our site, cookies are used and personal data is processed to improve the user interface. To find out what and what personal data we are processing, please go to the link. If you click "I agree," it means that you understand and accept all the conditions specified in this Privacy Notice.