JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7/themes/smoothness/jquery-ui.css">
<div id="a">:active state of close btn Fails</div>

CSS

.ui-dialog-titlebar-close {background:#F00}
.ui-dialog-titlebar-close:hover {background: #0F0}
.ui-dialog-titlebar-close:active {background: #000}

JavaScript

$("#a").dialog();

//Unbinding events makes it work
//$(".ui-dialog").find("*").unbind();