Stuck on an issue?
Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.
And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.
Carousel : cant modify height
See original GitHub issueDescribe the bug It is not possible to change the height of the carousels. Changing the width works correctly.
To Reproduce Put a carousel in any div and change the size with a class in that div to h-32 (for example).
Expected behavior The carousel should take the size allocated in the class of the div.
Screenshots
in code :
className="relative w-full h-full"
Issue Analytics
- State:
- Created a year ago
- Comments:5
Top Results From Across the Web
Bootstrap change carousel height - css - Stack Overflow
I'd like to change the height and still keep it full width. Is the height determined by the image height? How can I...
Read more >How do you Decrease Carousel size - Bootstrap Studio Forum
Hello, I added the carousel to my project and it is working fine. ... The carousel height is set by the height of...
Read more >Consistent Height Carousels with CSS Gradients and Object Fit
When the image changes so does the height of the container. If you put the carousel above some content, the content beneath the...
Read more >Bootstrap 4 Blueprints Edit And Change Carousel Height
Bootstrap 4 Blueprints Edit And Change Carousel Height . Bootstrap 4 Blueprints Rapid Page Creation ... Your browser can't play this video.
Read more >Consistent Height Carousels with CSS Gradients and Object Fit
The Bootstrap carousel is one of the most popular components in Bootstrap 5, but we have the technology to improve it and at...
Read more >
Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free
Top Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
The issue seems to be caused by the element that has
h-56class added to it.Ok, this isn’t how it is written in the regular Flowbite component, but I decided to change
h-56 sm:h-64 xl:h-80 2xl:h-96tomin-heights, then moved those rules totheme.carousel.base.Now, users can wrap their
Carouselin adivwith a specific height and it will respect that height. Otherwise, it will use the default heights specified by Flowbite.See #208