XION / Image Carousel are Cut Off At The Top
Deich8
Hello, at a certain resolution (tablet / landscape format) the images in the image carousel are cut off at the top (see attachment). Is there a solution for this? Best regards Ingo Layout Bundle: XION
Pavel
Accepted AnswerHi.
Add your own class name to the carousel addon and try following code (add it to custom.css file):
@media (max-width: 1199px) and (min-width: 992px) {
.YOUR_OWN_CLASS .sppb-carousel-extended-outer-stage {
height: 800px !important;
}
}
Mehtaz Afsana Borsha
Accepted AnswerHi
Thanks for contacting us. It seems ok in my end. Please see my screenshot below:
-Regards.
Deich8
Accepted AnswerPlease change the width in the browser. This effect occurs at a certain width. Best regards Ingo
Mehtaz Afsana Borsha
Accepted AnswerI have also checked like this and it seems fine on that also. Which browser are you using?
Deich8
Accepted AnswerHello attached is an animation that shows the error. Sorry, but it wasn't that difficult to reproduce the error. The error exists in all browsers. Best regards Ingo http://www.mooibike.deich8.de/images/mooibike.gif
Deich8
Accepted AnswerHello, is this included correctly? code in custum.css: @media (max-width: 1199px) and (min-width: 992px) { .mooibike .sppb-carousel-extended-outer-stage { height: 800px !important; } } How do I have to integrate it specifically and where? Best regards Ingo
Mehtaz Afsana Borsha
Accepted AnswerCustom css for Joomla 3 Note: 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.
Custom css for Joomla 4 Go to system--> https://prnt.sc/tDbSUJh6LiGu --> Default template-->Template options--> https://prnt.sc/A5nlsBvCQsqs And add your CSS there.
Deich8
Accepted AnswerHello, I pasted the code but I can't see any difference. I share the login data in the hidden settings. Best regards Ingo
Mehtaz Afsana Borsha
Accepted AnswerPath 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.
And also please follow this blog below:
https://www.joomshaper.com/blog/which-line-of-css-i-have-to-edit-code-inspector-in-action