The issue I had initially was the daterangepicker scrolling with the page. I have added a parentEl which is the square div element with selector $('#daterange').parent().parent() (with text "Select Range 5 days") which fixed the scrolling issue.

Now the size of the daterangepicker is limited to the width of that parentEl as you can see in the photo.

How do I fix the scrolling issue and keep the width of the daterangepicker working properly too?

package used: https://www.daterangepicker.com/#example1

$('#daterange').daterangepicker({
        parentEl: $('#daterange').parent().parent(),
        autoApply: true,
        maxDate: end,
        minDate: moment().subtract(dayRangeMax, 'days'),
        startDate: start,
        endDate: end,
        opens: 'left',

Current Result

Expected result