Image Height Not Adjustable - SPPageBuilder - Question | JoomShaper
Black Friday sale is live with flat 50% OFF. Sale ends soon! Grab your deal now!

Image Height Not Adjustable - SPPageBuilder

L

Laphroaig

SP Page Builder 3 years ago

Hi I need several image carousels on my site. However, these distort the images because the size cannot be adjusted - the height is always fixed 500 pixels, no matter what I define.

The images all have a resolution of 1024 * 768 pixels. The cache of Joomla was cleared. Also that of the browser.

Joomla: 4.2.3 Megainc: 2.0.0 Helix Ulitmate 2.0.11 SPPageBuilder: 4.0.5

0
25 Answers
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #88577

Hi

Thanks for contacting us. Use this custom CSS

.sppb-carousel-extended-item {
    width: 1024px !important;
    height: 768px !important;
}

Path towards custom CSS: Extensions>Templates>Styles> Click on your current default template name then choose Template Options. Then find custom CSS within the custom code.

-Regards.

0
L
Laphroaig
Accepted Answer
3 years ago #88588

It doesnt work :(

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #88772

Use this CSS on your custom.css file.

0
L
Laphroaig
Accepted Answer
3 years ago #88792

I had (I just hadn't written) - it doesn't work.

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #88803

Give me your super admin access on the hidden content properly. I cant access on that abive mentioned URL.

0
L
Laphroaig
Accepted Answer
3 years ago #88811

I have just updated the frontend URL (the first URL). The above access works (backend). But here are also my access data:

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #89070

Are you talking about this one right?

https://prnt.sc/7zy7ANFdRGFU

0
L
Laphroaig
Accepted Answer
3 years ago #89122

The display from the screenshot was a test - that's what I'm talking about. This was an attempt to see if the error is in my pages or if it also occurs with an empty new subpage. I first noticed it here: https://prnt.sc/NkWxduXEz6wH

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #89244

Please give me that page link.

0
L
Laphroaig
Accepted Answer
3 years ago #89344
0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #89457

Use this custom CSS in your custom.css file

.sppb-carousel-extended-item img{
  width: 1024px !important;
    height: 768px !important;
}
0
L
Laphroaig
Accepted Answer
3 years ago #89487

Unfortunately this does not work (correctly). It works only in a browser window with for example 1500 x 1100 pixels size. If the browser window is bigger, the gallery will be changed back to 930 x 500 pixels. Please solve the problem quickly, because we should go live soon.

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #89617

Did you use any custom CSS for the bigger window? Because it should work for all size.

0
L
Laphroaig
Accepted Answer
3 years ago #89667

No, I didn't use any other CSS for the higher resolution. You'd think it would fit all sizes, but it doesn't - I only discovered it by accident when I accidentally resized the browser window when moving it.

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #89791

You can set that resolution too. Please mention that resolution so that I can set it via media query CSS

0
L
Laphroaig
Accepted Answer
3 years ago #90094

What do you mean I can set the resolution? Yes, I can find the field, but it doesn't work after all. And as I said, the resolution of the images is 1024 * 768 pixels - and that's how they should be displayed if there is enough space. On the smartphone of course smaller = less pixels but in the same width and height ratio.

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #90196

I said give me that larger resolution so that I can set the height on that resolution by using custom CSS.

0
L
Laphroaig
Accepted Answer
3 years ago #90442

I don't know the resolution that users will use to view the page. I work for example on 5140 * 1440 pixels. But the error occurs on many other resolutions as well. Attached is a screenshot of how it does not work. Sense of responsive is that the images are scaled and not distorted in the height-width ratio.

https://prnt.sc/CUJ25lbgY8xW

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #90542

You can use this one


@media (max-width: 5140px){
.sppb-carousel-extended-item img{
  width: 1024px !important;
    height: 768px !important;
}
}

0
L
Laphroaig
Accepted Answer
3 years ago #90681

This also does not give a correct representation. The slider simply does not work properly! Also, aligning the slider for my monitor is pointless.

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #90725

Give me a screenshot please.

0
L
Laphroaig
Accepted Answer
3 years ago #90870

Please - here once more screenshots. Four of them: Joomshaper_5120: The slideshow that shows the problems with a screen 5120 pixels wide Joomsahper: As before, but with 2303 pixel width Joomshaper Settings: Screenshot of the settings, which show, that the height is ignored consequently. Another Slideshow: A slideshow from another manufacturer that works correctly.

http://joomla.p627021.webspaceconfig.de/images/Joomshaper_5120.png http://joomla.p627021.webspaceconfig.de/images/Joomshaper_2303.png http://joomla.p627021.webspaceconfig.de/images/Joomshaper_Settings.png http://joomla.p627021.webspaceconfig.de/images/Another_Slideshow.png

0
Mehtaz Afsana Borsha
Mehtaz Afsana Borsha
Accepted Answer
Support Agent 3 years ago #91083

This forum post may help you. You can follow this

https://www.joomshaper.com/forum/question/18899#qa-answer-90943

0
L
Laphroaig
Accepted Answer
3 years ago #92482

Unfortunately, that doesn't bring any improvement either. Then we'll have to switch to another component if you don't get this sorted out. A great pity.

0