What's your biggest current challenge? Have your say in Community Polls along the right column.

Help: Responsive Image Code Not Working Without Tabs

Help: Responsive Image Code Not Working Without Tabs

PD31
Excursionist
15 0 8

Hi everyone,

 

I have a piece of custom CSS in my store that makes product page images responsive, ensuring they display correctly on both mobile and desktop. Before implementing this code, the images within the description text appeared distorted and compressed on mobile devices.

 

Here’s the issue: this CSS was originally written when my product descriptions were displayed in tabs (generated by an app). However, I recently removed these tabs because they made the descriptions feel hidden and cramped. Now, after disabling the app, the code no longer works as intended.

 

Here’s the specific code I was using (also, see screenshot below):

 

@media screen and (max-width: 768px) {
.station-tabs-tabcontent img {
height: auto !important;
}
}

 

I tried adjusting the code myself, but I haven’t been able to make it work without the tabs. Could anyone help me modify this code to restore image responsiveness now that the tabs are gone?

 

Thanks so much for your help—I really appreciate it!


Capture d’écran, le 2024-11-20 à 17.12.14.png

Replies 0 (0)