How to change related article's display on mobile devices?

Posted in: Newspaper
Post count: 9
fettbauch
#80906
Nov 27, 2015 at 8:59 am

Hi,

I would like each article’s image expand to the max width on mobile devices.

Here’s the example: Each image resize to the max width on mobile devices.

Thanks a lot

  • This topic was modified 10 years by fettbauch.
Post count: 22421
Bogdan B.
#80943
Nov 27, 2015 at 11:48 am

Hello,

It can be done with custom css like so:
@media (max-width:767px){
.td-related-row .td-related-span4{
width:100%!important;
}
.td-related-span4 img {
width: 100%;
}
}
But this will stretch the image thumb and the images will lose a bit of their quality: http://screencast.com/t/Kmi2ruPLTf
This is because the thumb used is smaller and the image is stretched.
In order to change the default thumbnail used you can change it here: http://screencast.com/t/P4WA5KmIP
The defined thumbnails can be found here: http://screencast.com/t/hFMDEMrO

Thank you!

Post count: 9
fettbauch
#81241
Nov 30, 2015 at 5:19 am

Hi Bogdan,

it works!!! Thanks for your detailed explanation. 🙂

Viewing 3 posts - 1 through 3 (of 3 total)
The forum ‘Newspaper’ is closed to new topics and replies.