I've been struggling to get Colorbox working properly on this particular page, even after spending more time than anticipated. The link to the page has been removed for privacy reasons.
There's a Colorbox test link at the bottom right corner that should display a small logo image when clicked. In browsers like Firefox and Safari, the modal opens up perfectly centered above all other content on the page. However, in Internet Explorer, the modal is not centered and seems to be ignoring absolute positioning, causing it to push down all existing content on the page. Additionally, it doesn't open to the correct size and creates unnecessary scrollbars next to the modal image, making the whole interface look messy.
I can manage the scrollbar issue by adjusting the min-height of the modal, but I'm at a loss as to why it won't center correctly. It's worth mentioning that I didn't originally code this site, and it was created several years ago, potentially using various CSS hacks to resolve display issues which may now be contributing to the problem.
In contrast, Thickbox works fine on this site (clicking on "Play Video" in the dark blue section), but it has its own sizing and padding problems. This is why I wanted to switch to something more modern and flexible like Colorbox. There don't seem to be any conflicts between having both modal scripts/CSS files simultaneously since the issue persists with Colorbox even after completely removing Thickbox from the site.
If anyone has any advice or suggestions, I'd greatly appreciate it.