[ansonofficialParticipant]

Hi Support,

http://ansonli.com/

On this site’s homepage slider I am noticing that when viewed on large display screens, the images’ height gets cut off. The width is pushed to fit the screen just fine but then some of my images wind up getting their heads cut off etc.

How do I fix this?

Thanks,

Anson

[ChristopherModerator]

Hi there,

Please edit each slide, navigate to ‘Source settings’ tab and change ‘background fit’ to normal or contain.

If you’re not satisfied with result, please add following code in Customize -> Custom -> CSS :

.tp-bgimg.defaultimg {
    background-position: center 29% !important;
}

Hope it helps.

[ansonofficialParticipant]

Hi again,

So I tried doing background fit. Although it showed the picture in full, it left a lot of blank space or ruined the position of the picture. Also from what I can tell the custom css doesn’t do anything.

My main issue is my second slide on the homepage, my whole head gets cut off in a large monitor view. How can I fix this?

Anson

[ansonofficialParticipant]

This reply has been marked as private.

[RupokMember]

Hi there,

Your image dimension is not ideal for slider as it’s more square than wide. You need to choose more wider image to get expected result or let’s try changing the background position to a different position.

Thanks

[ansonofficialParticipant]

Or, what about using respect aspect ratio button to push the pictures to their actual dimensions?

I tried doing this and it looks like it works. However I’m going to have to crop the pictures down a bit to make it look good.

Would this method work?

Anson

[JoaoModerator]

Hi Anson,

If you are already using the respect ratio it seems to be working fine.

As you noticed you will need to edit the pictures anyway to be sure your head is not cut.

So either you upload wider pictures as Rad recommended or you edit it in a way that aspect ratio wont cut your head out.

Let us know if you need further help.

Joao

[Author]

Posts