JQuery Accordion when extended shows visual artifact in google chrome extension popup, mac only

Question

JQuery Accordion when extended shows visual artifact in google chrome extension popup, mac only

I am making a google chrome extension. Its popup has jQuery accordion inside. The popup page is laid out using html / css similar to this:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>

<div class="topLogo">
    <!-- static or unmovable content on top -->
</div>

<div id="mainSection">
    <div id="accordion">
        <!-- Accordion stuff here -->
    </div>
</div>

</body>
</html>

and CSS:

html,body{

    font-family: "Segoe UI", Tahoma, Geneva, sans-serif;
    min-width: 24em;
    -webkit-user-select: none;
}

.topLogo{
    margin: 2px;
    padding: 0px 0px 58px 0px;
    width: 100%;
}

#mainSection{
    clear: both;
    margin: 0;
    padding: 4px 0px 0px 0px;
    overflow-y: auto;
    max-height: 400px;  /* The height is actually defined in JS before page is displayed */
    border-top: thin solid #EEE;
}

How it works can be illustrated in this diagram:

enter image description here

The top of the popup is a static or non-movable section, and the Accordion is a scrollable DIV. The height depends on the number of tabs in the Accordion itself. The bottom DIV only starts scrolling if its total height exceeds the predefined 600px or so.

Accordion itself has initially closed all of its tabs, and only when the user clicks on one of their tabs does it expand. This in turn expands the popup as such:

enter image description here

Please note that I have not written any special code for any of the above functions. All this is done from the library jQuery UI

.

So, this all works fine in the Google Chrome version, but when I run the same extension in the latest Chrome version on my Mac OS X, when I click on any Accordion tab to expand it, the popup starts to make this weird "wobbly" / shaking motion when expanding, and this is very noticeable. So I'm curious what should I do to prevent this awful looking artifact on Mac?

UPDATE . I was able to create a test extension that demonstrates the problem. It's just a popup with the jQuery library included. (Here's a link to it: TestExtPopupOSX ) Can someone try it?

Here's the GIF I recorded with it. Unfortunately, due to the low fps, this doesn't really show it well, but you might be curious to see the clipping:

enter image description here