Fullscreen Image fit to Screensize

I Need Help
1

Hello,

i upgraded from V2 to V3 but when i use an image with an Alternative image in Fullscreen the image is not getting resized to the screen size like in V2. Any ideas?

Example with V3 and the old website with V2: Dropbox - File Deleted

2

Hi @MrMaulwurf888,

No matter what images i test with they all scale to fit in B3.
I see you have some “gallery” class on the images, what does that do?
It looks like you have some class that prevent the scale to fit or forces the images to scale up? :thinking:

Do you have a live site or a .bloc to check?

Cheers / Johny

3

Hello @Jakerlund,

i already deleted the “gallery” tag and tried a fresh new .blocs Project but its not working. Here is a simple TEST.bloc with 2 Images. Maybe i miss something, but in V2 it was working and i haven’t changed anything.

4

Hi again @MrMaulwurf888

Change each image from “Full Screen” to “Default” :+1:

default

5

Now they don’t fit the screen anymore :/. I don’t know why it was working with Fullscreen in V2 …

30
Bildschirmfoto 2019-01-05 um 17.01.30.jpg1590Ă—1058 245 KB

6

Hmm… i was to fast to response, it didn’t solve your issue.
I think you should resize the images before you use them inside Blocs.
The tall image is huge now (1600 x 2501 px, 598 KB)
I tried it at max 800 on the height and optimized it (512 x 800 px, 32 KB) and likewise for the other… max 800 for height and down from 551 KB to 69 KB.

TEST2.zip (130.5 KB)

test
test.gif600Ă—625 120 KB

7

Thats a workaround but V2 was working V3 not so…

8

Hi again @MrMaulwurf888

I noticed that to when i just checked.
There’s noting containing images height in B3 modals now, not like in B2.
But if you put this in Pages Settings > Add Code you get the same resizing as in B2 no matter how tall your image is.

<style>
.ml-auto, .mx-auto { max-height: 90vh;}
</style>
1 Like
9

Thats working :)! Thanks!

1 Like