Big Grid Slide – horizontal scale

Posted in: Newspaper
Post count: 11

Hi!
There’s a problem with big grid slide. If you use it on mobile devices (below around 500px) images in small thumb (td-small-thumb / the two smaller images) get scaled wrong!
As soon as they reach 100% horizontal and vertical horizontal dimensions stays at 100% but the image aspect ratio gets changed (image gets squashed).
You can see that on your Demo-Site too…
https://demo.tagdiv.com/newspaper/big-grid-slide/
Here’s an screenshot: https://ibb.co/nFxLme
Any help appreciated!

Post count: 20688

Hi,

There is indeed some squishing there, thank you for mentioning it. I will add this issue on our list and a solution will be found for those smaller modules.

If you want to keep using the slide, I could give you a code to make the two smaller modules same as the one above, on mobile. This would be the result
https://www.screencast.com/t/552tkdNJMYf

In case you want to use this code, here it is
https://pastebin.com/bnjRhn6M
It must be entered in the phones section here
https://www.screencast.com/t/OV9NWGOQAvPB

Sorry for the inconvenience.
Thanks

Post count: 14

I have same problem with horizontal scale, I put code above into addition css for mobile but problem is still there.
Screenshot: http://lado.com.hr/tcBigGrid1.png
I don’t need slide left or right. Can I see only post under first one?

Like this: https://ibb.co/nFxLme

Thanks!

Post count: 20688

Hi,


@ladotg
I tried the code from above again, seems to still work for the big grid slide
http://prntscr.com/lt0u13
Maybe force refresh the page in the browser after adding the code (Ctrl+Shift+R), could the browser cache to blame.

I could also take a look if you could provide a link to the page where you have the big grids slide element.

Thanks

Post count: 14

Hi, thanks for your answer.
I put code:
.td-big-grid-post-1,
.td-big-grid-post-2,
.td-big-grid-post-3
{
width: 100%!important;
margin-bottom: 3px !important;
margin-left: 0!important;
display: block !important;
}
.td-big-grid-slide {
height: 581px !important;
}
in advanced CSS for mobile in theme panel.
I delete your part of code “.td-big-grid-slide”
Now working fine ;-).
How can I get big picture for post-1 (first row), smaler for post-2 (second row) and two squere for post-3 and post-4 (third row)?
Like https://ibb.co/nFxLme (right picture).
I didn’t update theme to 9.2!
My site is tomislavcity.com.
Thank you!

Post count: 20688

Hi,

Maybe something like this – https://www.screencast.com/t/9xtFNVBxcf
Code for it – https://pastebin.com/XF7XtBzW

Post count: 14

Thank you, that’s it.

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