This topic has 2 voices, contains 3 replies, and was last updated by  TB Support 2375 days ago.

how to make the image fit with the screen size by css?

ThemeBurn Support › Forums › OpenCart Themes › Pavilion OpenCart Theme › how to make the image fit with the screen size by css?

This topic has been marked as resolved.

please take a look on this page

in mobile view, the image is too big that only part of it can be showed, what css i can use so as to resolve this problem?

thanks

 Ken Yeung
October 14, 2017 at 7:38 am #62037

Hi,

Can you try this extra CSS:

@media (max-width: 768px) {
  iframe[src*="instagram"] {
    max-width: 100% !important;
    height: auto !important;
  }
}

Add these styles from the Theme CP > Theme Settings > Custom > Custom Stylesheet text field.

P.S. Unfortunately there is no way to control the exact aspect ratio of the iframe widget so, you may need to remove the height style if the image is being cut.

BR,
ThemeBurn team
 TB Support
October 18, 2017 at 6:09 pm #62082

@media (max-width: 768px) {
iframe[src*="instagram"] {
max-width: 100% !important;
}
}

it work well in my site if skip the “height: auto !important;”
thanks!
 Ken Yeung
October 19, 2017 at 11:44 am #62086

Glad we’ve helped, mate!

BR,
ThemeBurn team
 TB Support
October 25, 2017 at 12:33 am #62172
Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.