Different images sizes on website

Ask the Community General Questions
1

Hi all,

I created a slider. After watching the result in elfsight - everything was looking good. On website, mostly all images have differnet sizes. On mobile the widget hight is cutting of. What can I do to fix it?

BR

1 Like
3

Hi there, @user14693 :waving_hand:

Could you please send me a link to the page, where your widget is installed?

5

@user14693 Thanks for sharing a link!

I’ve forwarded this issue to the devs and will update you once any news comes up :slightly_smiling_face:

1 Like
6

Hi there, @user14693 :waving_hand:

We’ve fixed the issue by adding this code to the Custom CSS field on the Settings tab of your widget’s settings:


.global, .embed-16by9 {
  height: 785px;
}

@media (max-width: 500px) {
	.eapp-slider-media-container .eapp-slider-media-component {
  max-width: 100% !important;
	}
  .global, .embed-16by9 {
    height: 614px !important;
  }
}

.eapp-slider-media-container img {
  max-width: none !important;
}

Check it out and let me know if it’s fine now :slightly_smiling_face:

1 Like
8

Awesome. It works… Thx and BR

2 Likes
9

Awesome, you’re always welcome :wink:

10

Short question: is it possible to set iframe on full width? in settings a max width of 2880px is only possible.

1 Like
11

This CSS code will help you set the widget width to 100%:

.global-styles,
.py-block:has(.elfsight-app-2b18a0e2-0e08-47e6-b642-76e2de30c4fa),
.py-block:has(.elfsight-app-2b18a0e2-0e08-47e6-b642-76e2de30c4fa) *:not(.elfsight-app-2b18a0e2-0e08-47e6-b642-76e2de30c4fa *) {
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin: 0 !important;
  max-width: 100vw;
}

Please try it out and let me know if it helped :slightly_smiling_face:

1 Like
12

it is now on full width! Thx

1 Like
13

No sweat :wink: