Fixed scroll button

site-https://opensourcefrontend.netlify.app/

How to fix the alignment of the scroll button on the month section. It keeps on going up and down while scrolling.

Hi,

The buttons seem to be going up and down because the carousel is resizing depending on which timeline is being displayed. For example, the timeline for January, February, and March is taller than the timeline for April, May, and June.

One possible approach to stop the carousel from resizing is to give each carousel item some arbitrary fixed height:

.carousel-item{
  padding: 7% 15%;
  height: 1200px; // your fixed height
}

However, keep in mind that depending on your fixed height and the user’s browser, your timelines might be too tall to fit inside of the carousel (causing overflow).

1 Like