Carousel Captions - Fixed position with different results
-
Hi all,
I'm facing a problem with carousel captions put in place by using custom CSS as described here in the forum. CSS I used is:
.lay-carousel-sink-parent { position: fixed !important; bottom: 40px !important; z-index: 999 !important; }
The result should look like this with the caption attached to the bottom of the page:
https://jooskeller.com/kindergarten-heilbronn/In some of the projects it unfortunately looks like this:
https://jooskeller.com/theresienturm-heilbronn/It seems that in the second situation the caption sits inside the carousel-container. As far as I can see the settings are completely the same so i can't trace back the problem causing the different appearance.
Can anybody help?
Thanks a lot!
Kyrill -
add this css
.column-wrap._100vh > .col.absolute-position.align-middle.type-carousel{ top: auto!important; -webkit-transform: none!important; -ms-transform: none!important; transform: none!important; }
nice website!
-
Hello Kyrill,
Great website :) Just a small question, how did you center your carousel?
-
@arminunruh
works great! thank you so much! -
right click on row with carousel and set "use browser height for row height",
then you can use the vertical-align-buttons to move the carousel in the middle,
and i put a fixed height for the height of the carousel
Hope this helps!
Kyrill -
Need custom programming for your Lay Theme site?
I regularly add new features to Lay Theme for free, based on user feedback. But if you or your client need something more specific, I’m happy to offer custom paid programming tailored to your project.
Email info@laytheme.com with the subject "Custom paid programming for Lay Theme" and a short description of what you need — I’ll reply with a cost estimate.
Custom features I build often make it into future Lay Theme updates, so your idea might benefit the whole community.
Before you post:
- When using a WordPress Cache plugin, disable it or clear your cache.
- Update Lay Theme and all Lay Theme Addons
- Disable all Plugins
- Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"
This often solves issues you might run into
When you post:
- Post a link to where the problem is
- Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
- If the problem is difficult to explain, post screenshots / link to a video to explain it