Why is my .sticky-top class not working in Bootstrap 4?

One more thing to check is if any parent element has one of these css properties set:

• overflow
• overflow-y
• overflow-x

If this property is set to one of these vales it will NOT work: auto, hidden, overlay, scroll.

The best solution is to remove it or change its value to 'unset'

What browser you are using?

position: sticky is not fully supported in all browsers.

In IE11 and IE10 will render position: sticky as position: relative.

updated: set class name "sticky-top" in <header> will work because it's relative sticky to the parent element, in this case, it's the whole HTML body

<header class="sticky-top">