I use banners on my site, including at the top of the page in the banner top position. www.FinishingAndCoating.com
The banners are 728x90 (as the template banners were), but when looking at the banners on a phone, they seem scrunched and out of proportion (see screenshot). I inspected the pages and it seems that on inside pages when viewed on a phone, the banners become 556x90 or 516x90 when I looked at the pages. (see attachments).
I was told by my template maker to add this code to custom CSS, which I did but didn't change anything:
@media (max-width: 767px) {
.mod-banners__item.banneritem img {
width: 100%;
height: 100%;
}
}
How can I make these banners remain proportional when viewed on a phone?
Thank you very much
The banners are 728x90 (as the template banners were), but when looking at the banners on a phone, they seem scrunched and out of proportion (see screenshot). I inspected the pages and it seems that on inside pages when viewed on a phone, the banners become 556x90 or 516x90 when I looked at the pages. (see attachments).
I was told by my template maker to add this code to custom CSS, which I did but didn't change anything:
@media (max-width: 767px) {
.mod-banners__item.banneritem img {
width: 100%;
height: 100%;
}
}
How can I make these banners remain proportional when viewed on a phone?
Thank you very much
Statistics: Posted by tp_finish — Fri Mar 15, 2024 12:10 pm